在OpenLayers 3中使用Tiled Google Map

Question

如何在OpenLayers 3中使用谷歌地图？
我想从OpenLayers 2迁移到3.这是一个例子： 谷歌地图与openlayers集成的例子
但是使用这种方法需要更改旧的html代码（两个元素需要，'gmap'和'olmap'提到的例子）。
ol3正式不支持谷歌地图，但我的问题是：
“我如何在我的项目中使用Google Maps Tile Service，就像MapServer一样，无需为脚本标记添加google api参考 （用于优化目的）？”

这是我的旧代码，可以正常使用OpenLayers 2：

var map = new OpenLayers.Map("map_canvas", {
    controls: [
        new OpenLayers.Control.PanZoomBar(),
        new OpenLayers.Control.ScaleLine(),
        new OpenLayers.Control.MousePosition(),
        new OpenLayers.Control.OverviewMap()
    ],
    units: "m",
    numZoomLevels: 21
});
var gmap = new OpenLayers.Layer.Google(
    { type: google.maps.MapTypeId.ROADMAP, numZoomLevels: 21}
);
map.addLayers([gmap]);

和HTML代码：

<div id="map_canvas">
</div>

感谢任何帮助

Answer 1

我找到了解决方案：

的jsfiddle

 var map = new ol.Map({ target: 'map', layers: [ new ol.layer.Tile({ source: new ol.source.OSM({ url: 'http://mt{0-3}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}', attributions: [ new ol.Attribution({ html: '© Google' }), new ol.Attribution({ html: '<a href="https://developers.google.com/maps/terms">Terms of Use.</a>' }) ] }) }) ], view: new ol.View({ center: ol.proj.transform( [-110, 45], 'EPSG:4326', 'EPSG:3857'), zoom: 3 }) }); 

 html, body, #map { padding: 0; margin: 0; width: 100%; height: 100%; } 

 <link href="http://openlayers.org/en/master/css/ol.css" rel="stylesheet"/> <script src="http://openlayers.org/en/master/build/ol.js"></script> <div id="map"></div> 

但我不确定此代码是否与Google使用条款形成对比。