I am developing a website that has a mapping and i am using leaflet. Now im on the part that i will hide /show markers that i made.
below is my code finding the image that i want and use it as a marker
var Icon1 = L.icon({
iconUrl: 'legends/fire.GIF',
iconSize: [170, 120],
iconAnchor: [100, 120],
popupAnchor: [-7, -80]
the other one below is my code when putting the mark on the map.
function mark()
{
if (select1.value === "Fire"){
var note = document.getElementById('note');
var datepick = document.getElementById('demo1');
var timepick = document.getElementById('timepick');
map.on('click', function(e){
var marker = new L.Marker(e.latlng,{icon: Icon1});
marker.bindPopup("</a><br>FIRE</br>Date:"+datepick.value+"</br>Time:"+timepick.value+"</br>Address:"+note.value+"<br>Suspect Sketch<br><a href=legends/suspect.jpg rel=lightbox><img src = legends/suspect.jpg height=100 width = 100/>").addTo(map);
marker.on('dragend');
});
This is my code in hiding the marker.
function closure(marker){
var checkbox = document.getElementById("chbx")
$(chbx).click(function(){
if(map.hasLayer(marker)){
window.alert("I want to hide the marker");
}
window.alert("I want to show the marker");
})
}
This is just what i wanted. 1.Add A marker on the map 2.Hide/Show the marker in the map 3.Make this happen during run time or when i try it.
I try everything but still nothing happens. What is the right thing to do to call my hide/show function in checkbox?