[英]Angular 10 - Leaflet - Webpack breaking URL to marker-icon.png
[英]marker symbols for leaflet_Ajax, looking always for default marker in js/images/marker-icon.png
我是新手,但過去已經開發了一些交互式地圖。 我開始致力於在無人機上顯示GPS設備。 UAV在服務器上發送位置信息,並具有一個php代碼,該代碼可根據相關請求返回一些傳感器值(采用geojson格式,因此我不必做很多...)。 當我遇到leaflet_Ajax時,我一直在尋找一些解決方案,以了解如何使用Ajax無縫執行此操作。 。 我遇到了很多問題,大部分都由關於stackoverflow的一些問題解決,例如這個問題和其他一些問題。
現在這是我如何為點標記編寫代碼:
var geojsonLayer = new L.GeoJSON.AJAX("myserver/get_geoj.php?stype=particle&sval[min]=2&sval[max]=26",{pointToLayer: redmarkers, onEachFeature: popUp});
function popUp(feature, layer) {
layer.bindPopup(feature.properties.sensor_v);
},
我還有另一個函數redmarkers,它返回紅色的圓形標記。 發生的是,最終它正在從服務器加載數據……哦……但是它沒有將彈出窗口或標記綁定到該層。 它在js / images / marker-icon.png中尋找(我猜有些)默認標記圖像作為標記符號。 這不存在,因此給我一個錯誤。 但是,如果我拍攝任何隨機圖像並將其命名為marker-icon.png並將其放在所需的位置,它將在地圖上顯示該圖像,但仍不綁定彈出窗口。
我究竟做錯了什么。 由於我也是堆棧溢出的新手,如果您需要更多信息,或者如果我沒有問正確的問題,請告訴我。
好的,所以我解決了這個問題,但是我認為其他人以后可能會犯類似的錯誤,因此我應該回答這個問題。
我不小心以某種方式編輯了leaflet.js文件。 我不記得這樣做了。 我刪除了放置在js / images文件夾中的marker-icon.png的虛擬圖像,它仍然顯示相同的標記。 我意識到它已經緩存了它,所以我禁用了chache,只是在控制台中意識到錯誤與leaflet.js有關。 我更新了leaflet.js的版本(磁盤上有備份副本,因此相同的版本沒有更新或類似的內容),並且現在可以正常工作了。 這是我當前的代碼
var geojsonLayer = new L.GeoJSON.AJAX(dataurl,{
pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng, redRegionStyle);
},
onEachFeature: onfeature
});
function onfeature(feature, layer)
{
layer.on(
{
mouseover: highlightFeature,
mouseout: resetHighlight
});
layer.bindPopup(feature.properties.sensor_v.toString());
}
它可以像我喜歡的那樣完美地突出顯示功能,還具有將功能綁定到彈出窗口的功能。
對所有打擾我的人表示抱歉,因為這是我自己的愚蠢錯誤
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.