Google Maps - display/hide marker onclick
The Problem: I got a Google Map开发者_如何转开发. In my init() Method I set all the Markers to its lon/lat. Now I want to have some checkboxes on my page. In my map I have several Markers for Icecream, Playground and Gasstation. Now, clicking on the checkbox for Playground I want to display all Playground markers. On disabling the Checkbox, I want to hide all the Playground Markers. The same for the other Markers. I have created my Checkboxes and written an onclick function for it:
function show_poi_in_map(input_id){
var select_id = input_id;
var var_name = $('#' + select_id).attr('checked')?1:0;
if (var_name == 1) {
alert('checked');
}else{
alert('not checked')
}
}
But how to go on with it? I am using jQuery. Maybe this will help.
google.maps.event.addListener(map, 'click', function(event) {
addMarker(event.latLng);
});
function addMarker(location) {
marker = new google.maps.Marker({
position: location,
map: map,
draggable: true,
visible: true
});
google.maps.event.addListener(marker, 'click', function(event) {
this.setMap(null);
});
}
I know its too late. But for future use.
I have implemented the same
I defined two checkboxes
<body>
<input type="checkbox" id="icecream" onclick="boxclick(this,'icecream')" >IceCream
<input type="checkbox" id="playground" onclick="boxclick(this,'playground')" >PlayGround
</body>
In
function boxclick(box,category) {
if (box.checked)
{
showMarkers(category);
}
else
{
hideMarkers(category);
}
}
function showMarkers(category)
{
if(category=='icecream')
{
for(var i=0;i<icecream.length;i++)
{
icecream[i].setVisible(true);
}
}
if(category=='playground')
{
for(var i=0;i<playground.length;i++)
{
playground[i].setVisible(true);
}
}
}
Similar Function for HideMarkers, Just place setVisible(false) instead of setVisible(true)
加载中,请稍侯......
精彩评论