Thursday, 15 August 2013

javascript - HIDE/SHOW Markers -



javascript - HIDE/SHOW Markers -

i developing website has mapping , using leaflet. im on part hide /show markers made.

below code finding image want , utilize marker

var icon1 = l.icon({ iconurl: 'legends/fire.gif', iconsize: [170, 120], // size of icon iconanchor: [100, 120], // point of icon correspond marker's location popupanchor: [-7, -80] // point popup should open relative iconanchor

the other 1 below code when putting mark on 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><strong>fire</strong></br><strong>date:</strong>"+datepick.value+"</br><strong>time:</strong>"+timepick.value+"</br><strong>address:</strong>"+note.value+"<strong><br><strong>suspect sketch</strong><br><a href=legends/suspect.jpg rel=lightbox><img src = legends/suspect.jpg height=100 width = 100/>").addto(map); marker.on('dragend'); });

this code in hiding marker.

script type="text/javascript"> function closure(marker){ var checkbox = document.getelementbyid("chbx") $(chbx).click(function(){ if(map.haslayer(marker)){ window.alert("i want hide marker"); } window.alert("i want show marker"); }) } </script>

this wanted. 1.add marker on map 2.hide/show marker in map 3.make happen during run time or when seek it.

i seek still nil happens. right thing phone call hide/show function in checkbox?

here's way it: define function takes marker argument, , jquery create function toggle visibility of layer:

function closure(marker){ $('#yourcheckbox id').click(function(){ if(map.haslayer(marker)){ map.removelayer(marker) } else {map.addlayer(marker)} }) }

than, within click event of map, add together closure function:

map.on('click', function(e){ marker = new l.marker(e.latlng).addto(map); closure (marker) })

javascript html hide show leaflet

No comments:

Post a Comment