google 地图中的传单

Question

我们可以在 google 地图中使用传单吗？搜索和阅读有关它的文章，我们发现有一些传单插件可用。使用它我们可以使用 google map + leaflet.

构建应用程序

Answer 1

您可以使用 leaflet JS API 工具包并在其中使用 google 地图图像。

编辑：

检查此示例，其中 google tiles/imagery 与传单套件一起使用。

var map = new L.Map(
  'map', 
  {
    center: new L.LatLng(51.51, -0.11), 
    zoom: 9
  }
);

var googleLayer = new L.Google('ROADMAP');

map.addLayer(googleLayer);

#map {
  height: 500px;
  width: 500px;
}

<script src="http://cdn.leafletjs.com/leaflet-0.3.1/leaflet.js"></script>
<script src="http://maps.google.com/maps/api/js?v=3.2&sensor=false"></script>
<script src="http://matchingnotes.com/javascripts/leaflet-google.js"></script>

<div id="map"></div>

来源：https://gist.github.com/crofty/2197701

Answer 2

明确一点：Leaflet 只是一个查看库，而 Google Maps 提供基础地图（图块）和 API（如 Leaflet）。

Google 地图 requires 当你使用它的底图时，你只使用它的 API。

然而，确实有一个 plugin for Leaflet 声称充当 Google 地图 API 的代理，因此尊重其使用条款，所以是的，听起来是-能。

然后你要决定是使用带有该插件的 Leaflet 还是直接使用 Google 地图 API。在这一点上，这听起来更像是一个问题，即哪一个可以为您提供您正在寻找的功能。

更新

原来提到的插件不再维护

这是最近的一个：Leaflet.GridLayer.GoogleMutant

Answer 3

为了静态目的，您可以在传单中自由添加 google 地图图块。您不需要添加第三方插件和google API。对于静态图块，您可以添加以下代码，对于街道，

googleStreets = L.tileLayer('http://{s}.google.com/vt?lyrs=m&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

混合，

googleHybrid = L.tileLayer('http://{s}.google.com/vt?lyrs=s,h&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

卫星，

googleSat = L.tileLayer('http://{s}.google.com/vt?lyrs=s&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

地形

googleTerrain = L.tileLayer('http://{s}.google.com/vt?lyrs=p&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

请注意 URL 中“lyrs”参数的差异：

Hybrid: s,h;
Satellite: s;
Streets: m;
Terrain: p;

google 地图中的传单

Leaflet in google maps

google-maps

leaflet

mapbox