谷歌地图切换标记

时间:2010-12-06 01:03:42

标签: google-maps checkbox toggle google-maps-markers

如果选中复选框,我需要显示标记 如果没有选中则隐藏

function initialize() {
    //map
    var UCM = new google.maps.LatLng(37.366572, -120.424876);
    var myOptions = {
        zoom : 13,
        center : UCM,
        mapTypeId : google.maps.MapTypeId.ROADMAP
    };
    //streetview
    var panoramaOptions = {
        position : UCM,
        pov : {
            heading : 0,
            pitch : 0,
            zoom : 0
        }
    };
    var panorama = new google.maps.StreetViewPanorama(document
            .getElementById("pano"), panoramaOptions);
    var map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);
    map.setStreetView(panorama);
    //bus stops

    var GLaps = new google.maps.LatLng(37.315284, -120.505021);

    var infowindow = new google.maps.InfoWindow(
            {
                content : '<br>GRANVILLE LUXURY APARTMENTS </br>' + '<br><b><FONT COLOR="#0000FF">C1 BLUE LINE</FONT></b>:(AM) 6:45, 8:05, 9:25, 10:45; (PM)12:05, 1:25, 2:45, 4:05, 5:25, 6:45, 8:05</br>' + '<br><b><FONT COLOR="cccc00">C1 GOLD LINE</FONT></b>: (AM) 7:25, 8:45, 10:05, 11:25; (PM) 12:45, 2:05, 3:25, 4:45, 6:05, 7:25, 8:45, 10:05</br>'
            });
    var marker = new google.maps.Marker( {
        position : GLaps,
        draggable : false,
        map : map,
        title : 'Granville Luxury Apartments Departure Times',
        clickable : true
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.open(map, marker);
    });
}

2 个答案:

答案 0 :(得分:0)

Toggling on/off Markers in Google Maps API v3

这与您要实现的目标非常相似。如果有帮助,请告诉我。

答案 1 :(得分:0)

你可以使用一些jquery。下面添加/隐藏谷歌脚本只是为了得到一个想法,我认为它没有工作。

$("#mycheckbox").click(function(){
    if ($(this).is(":checked")){
       //add marker
        marker = new google.maps.Marker({
              position: location,
              map: map
          });
    }
    else{
        //hide
        marker.setMap(null);
    }
});