Although I'm relatively new to Leaflet, I have experience creating interactive maps in the past. Recently, I've been working on a project involving displaying GPS data from a UAV. The UAV transmits location information to a server, which then returns sensor values in geojson format via PHP. To streamline this process, I looked into using Ajax and stumbled upon Leaflet_Ajax. While facing some challenges, I found helpful solutions on platforms like Stack Overflow, such as this thread.
Now, let me walk you through how I'm coding the markers for the points:
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);
},
In addition, I've defined another function called redmarkers that generates red-colored circle markers. Currently, although the data is being successfully loaded from the server, there seems to be an issue with binding the popup or markers to the layer correctly. The code appears to be looking for default marker images at js/images/marker-icon.png, which doesn't exist and consequently results in an error. Even when substituting it with a random image named marker-icon.png, the popup still isn't bound.
I'm unsure of what could be causing this hiccup. Given my limited experience navigating Stack Overflow, feel free to request additional details or point out any shortcomings in my query.