在 Leaflet 插件中使用 3D 视图 Google 地图

Question

我使用传单地图插件。我编写此代码以在 LeafLet

中创建和加载 google 地图图块

 var map = L.map('map').setView([31.2744015, 48.7251283], 18);

    // load a tile layer

    //Satellite:
    L.tileLayer('http://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}', {
        maxZoom: 20,
        mapTypeId: google.maps.MapTypeId.SATELLITE,
        subdomains: ['mt0', 'mt1', 'mt2', 'mt3']
    }).addTo(map);

这段代码工作正常。但我想在此插件中加载另一个 google 地图选项，如 3D 查看地图

但是会这样吗？谢谢你的帮助。

Answer 1

两件事：

仅使用 L.TileLayer 从 Google 加载地图图块违反了 Google 地图的条款和条件（关于 "accessing the content only through the Google Maps API" 的部分）。如果 Google 对此生气，请不要感到惊讶。

正如问题的答案中指出的那样，«Leaflet Map API with Google Satellite Layer» , look in the Leaflet plugins list. In particular, GoogleMutant 可能会引起您的兴趣。
截至目前，Leaflet 仅能够显示二维地图。没有计划让它显示倾斜图像，或提供倾斜功能。

如果您需要这些功能，您可能想看看其他网络地图库，例如 https://www.mapbox.com/mapbox-gl-js/api/ or https://cesiumjs.org/。这些可以处理更多的相机自由度，以及一定程度的地形高程显示。

Answer 2

https://labs.mapbox.com/bites/00093/

请查看它的源代码，如

window.setInterval(function(){
        $('.rotating').attr('style','-webkit-transform:rotateZ('+angle+'deg);-moz-transform:rotateZ('+angle+'deg);-moz-transition:-moz-transform 0.75s;');
        if ($('.rotating').length>0) $('.pivotmarker').attr('style','-webkit-transform: rotateY('+angle+'deg);-moz-transform: rotateY('+angle+'deg);-moz-transition:-moz-transform 0.75s;');
        angle=angle*-1;
    },1500);

有帮助吗

在 Leaflet 插件中使用 3D 视图 Google 地图

Use 3D View Google Map in Leaflet plugin

google-maps

leaflet

dc.leaflet.js

leaflet.draw