1. 程式人生 > 程式設計 >leaflet載入geojson疊加顯示功能程式碼

leaflet載入geojson疊加顯示功能程式碼

這篇文章主要介紹了leaflet載入geojson疊加顯示功能程式碼,文中通過示例程式碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

geojson需要先製作shp,然後匯入下面網站生成geojson。

https://mapshaper.org/

geojson,最好放後臺,前臺通過非同步請求去載入json,然後顯示。

getGeojsonByName({name:geojson_name}).then(data=>{
     if (this.bondarylayer) {
      if (this.map.hasLayer(this.bondarylayer))
      {
       this.map.removeLayer(this.bondarylayer);
      }
     }
     this.bondarylayer = L.geoJSON(data,{
      style: {
       color: '#E066FF',fillOpacity: 0,weight: 4,},pane: 'overlayPane'
     });
     this.map.addLayer(this.bondarylayer);
    });

疊加地圖之後,

this.map.flyTo([34.22,109.114],9,{ animate: true,duration: 0.2 });

將地圖的視野範圍新增到相應區域。

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支援我們。