leaflet.js使用(底图选择)

leaflet.js使用
leaflet.js官方文档
底图可选择

let url = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';  // open street map
   	url = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=xxxxxx'; // map box
   	url = 'http://tile.stamen.com/toner-lite/{z}/{x}/{y}.png'; // stamen
   	url = 'https://{s}.basemaps.cartocdn.com/rastertiles/light_all/{z}/{x}/{y}.png'; // basemaps
    //初始化 地图
    var leafletMap = L.map('mapDiv').setView([41, 123], 5);
    //将图层加载到地图上,并设置最大的聚焦还有map样式
    L.tileLayer(url, {
      minZoom: 5,
      maxZoom: 18,
    }).addTo(leafletMap);

示例

  • open street map
    leaflet.js使用(底图选择)
  • stamen
    leaflet.js使用(底图选择)
  • basemaps
    leaflet.js使用(底图选择)
上一篇:在vue中使用leaflet加载地图


下一篇:43.(leaflet之家)leaflet叠加geojson图层(挖洞)