Google Satellite Layerを使用したリーフレットマップAPI

StackOverflow https://stackoverflow.com/questions/9394190

質問

私はとても興味があります リーフレットマップAPI.

ただし、Google Satelliteレイヤーを使用できる必要があります。リーフレットにGoogle衛星レイヤーを追加する方法についての例を見つけることができませんでした。これを行うには、Google Maps APIをまだロードする必要があることを理解しています（OpenLayersには例があります）。

役に立ちましたか？

解決

Leafletには、利用可能なすべてのプラグインを公開するための公式ページがあります。 http://leafletjs.com/plugins.html

Googleレイヤーサポートをリーフレットに追加するためのプラグインがあります。

他のヒント

プラグインやGoogle APIは必要ありません。XYZタイルレイヤーとして追加できます。

通り

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']
});


Note the difference in the "lyrs" parameter in the URL:
Hybrid: s,h;
Satellite: s;
Streets: m;
Terrain: p;

それのためのサードパーティのプラグインがあります：デモ： http://psha.org.ru/leaflet/bel.html （スイッチャーを使用してGoogleマップに切り替える）出典： http://psha.org.ru/leaflet/google.js

このリポジトリには、Googleと他の非常に便利なプラグインが少ないタイルレイヤーが少なくなっています。https://github.com/shramov/leaflet-plugins

Googleタイトルレイヤー トラフィック 

var googleTraffic = L.tileLayer('https://{s}.google.com/vt/lyrs=m@221097413,traffic&x={x}&y={y}&z={z}', {
        maxZoom: 20,
        minZoom: 2,
        subdomains: ['mt0', 'mt1', 'mt2', 'mt3'],
    });

彼らを見てください 一般用語

誰かがこれを助けることを願っています

衛星レイヤー用のGoogleマップAPIに代わるもの： Esri World Imagery Tilesを備えたLeaflet.js

<script>

    var map = L.map('map').setView([-41.2858, 174.78682], 14);

    var mapLink = '<a href="http://www.esri.com/">Esri</a>';
    var wholink = 'i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community';

    L.tileLayer(
        'http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
        attribution: '&copy; '+mapLink+', '+wholink,
        maxZoom: 18,
        }).addTo(map);

</script>
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top