API Leaflet Map avec Google Satellite Layer

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

Question

Je suis très intéressé par l ' API Leaflet Map .

Cependant, je dois pouvoir utiliser Google Satellite Layer.Je n'ai pas été en mesure de trouver un exemple sur la façon d'ajouter une couche satellite Google à Leaflet.Je comprends que je devrai toujours charger l'API Google Maps pour ce faire (OpenLayers a un exemple).

Était-ce utile?

La solution

Leaflet a une page officielle pour publier tous les plugins disponibles: http://leafletjs.com/plugins.html

Vous y trouverez des plugins pour ajouter la prise en charge des calques Google à Leaflet.

Autres conseils

Vous n'avez pas besoin d'un plugin ou de l'API Google, vous pouvez l'ajouter en tant que couche de tuiles XYZ.

Rues 

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

Hybride: 

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

Satellite: 

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

Terrain 

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;

Il existe un plugin tiers pour cela: Démo: http://psha.org.ru/leaflet/bel.html (commutateursur Google Maps avec le sélecteur) Source: http://psha.org.ru/leaflet/Google.js

ce dépôt contient quelques couches de tuiles google et d'autres plugins très utiles: https://github.com/shramov/leaflet-plugins

Couche de titre Google avec Trafic 

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

Veuillez consulter leurs Conditions générales

J'espère que quelqu'un vous aidera

Alternative à l'API Google Maps pour la couche satellite: Leaflet.js avec les tuiles Esri World Imagery 

<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>
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top