這篇文章主要講解了“怎么加載GeoJSON數(shù)據(jù)”，文中的講解內(nèi)容簡單清晰，易于學(xué)習(xí)與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學(xué)習(xí)“怎么加載GeoJSON數(shù)據(jù)”吧！

成都創(chuàng)新互聯(lián)是一家專業(yè)提供青州企業(yè)網(wǎng)站建設(shè),專注與成都做網(wǎng)站、成都網(wǎng)站建設(shè)、H5響應(yīng)式網(wǎng)站、小程序制作等業(yè)務(wù)。10年已為青州眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站制作公司優(yōu)惠進(jìn)行中。

Leaflet是適用于桌面端和移動端交互地圖的開源JavaScript類庫。JS庫的大小經(jīng)過壓縮后有38k左右，擁有開發(fā)者需要的全部地圖功能。 

Leaflet保持著簡單、性能和實用性的設(shè)計思想?？梢栽谒兄饕淖烂婧鸵苿佣似脚_上高效的運轉(zhuǎn)，可以擴(kuò)展插件，它有一個漂亮、易用和文檔清晰的API，有一個簡單、易讀的源代碼

Leaflet可以通過加載GeoJSON數(shù)據(jù)，批量加載點、線、面數(shù)據(jù)，并轉(zhuǎn)化為相應(yīng)的特征對象，實現(xiàn)數(shù)據(jù)顯示，彈出數(shù)據(jù)信息管理。

下邊通過一個GeoJSON加載點數(shù)據(jù)，顯示為圖標(biāo)進(jìn)行說明：

//循環(huán)遍歷每一個feature，綁定彈出氣泡和提示信息

function onEachFeature(feature, layer) {

if(feature.properties && feature.properties.name) {

layer.bindTooltip(feature.properties.name);

layer.bindPopup(feature.properties.address);

}

}

//設(shè)置圖標(biāo)樣式

var baseballIcon = L.icon({

iconUrl: 'img/leaflet/school_icon.png',

iconSize: [24, 27],

iconAnchor: [12, 27],

popupAnchor: [0, -28],

tooltipAnchor: [0, -20]

});

//加載json數(shù)據(jù)

$.getJSON('sampledata/ta_school_point.json', function(data) {

//通過geojson創(chuàng)建圖層

schoollayer =

L.geoJSON(data, {

onEachFeature: onEachFeature,

           //循環(huán)設(shè)置圖標(biāo)樣式

pointToLayer: function(feature, latlng) {

return L.marker(latlng, {

icon: baseballIcon

});

}

});

          //添加到地圖，并定位

schoollayer.addTo(map);

map.fitBounds(schoollayer.getBounds());

   });

感謝各位的閱讀，以上就是“怎么加載GeoJSON數(shù)據(jù)”的內(nèi)容了，經(jīng)過本文的學(xué)習(xí)后，相信大家對怎么加載GeoJSON數(shù)據(jù)這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是創(chuàng)新互聯(lián)，小編將為大家推送更多相關(guān)知識點的文章，歡迎關(guān)注！