现在我有类别的地图标记。我想为谷歌地图添加默认地图标记。怎么样?

时间:2015-07-11 01:45:58

标签: google-maps dictionary marker

来自这里的演示here。正如您所看到的那样,如果您单击该复选框,就像餐馆或公园一样。标记将出现。但这些是两个类别项目的标记。

我想为地图的默认位置添加一个地图标记。

我尝试添加此功能,但它无效。

var map;
var var_location = new google.maps.LatLng(45.430817,12.331516);
function map_init() {           

    var var_mapoptions = {
        center: var_location,
        zoom: 16,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        panControl:false,
        rotateControl:false,
        streetViewControl: false,
        scrollwheel: false,
    };
    map = new google.maps.Map(document.getElementById("map"),
        var_mapoptions);
    var contentString = 
        '<div id="mapInfo">'+
        '<p><strong>Peggy Guggenheim Collection</strong><br>'+
        'Dorsoduro, 701-704<br>' +
        '30123, Venezia<br>'+
        'P: (+39) 041 240 5411</p>'+
        '</div>';

         var var_infowindow = new google.maps.InfoWindow({
           content: contentString
         });
    var var_marker = new google.maps.Marker({
    position: var_location,
    map: map,
    icon: 'images/mapicon.png',
    title:"Click for information about the Guggenheim museum in Venice",
          maxWidth: 200,
          maxHeight: 200
  });

   google.maps.event.addListener(var_marker, 'click', function() {
     var_infowindow.open(map,var_marker);
  });
}

        var places={
        restaurant:{
          label:'restaurants',
          //the category may be default-checked when you want to
          //uncomment the next line
          //checked:true,
          icon: 'images/map-marker/01.png' ,
          items: [
                  ['Melt Bar and Grill', 41.485345, -81.799047],
                  ['Sloane Pub', 41.486182, -81.824178],
                  ['Spitfire Salon', 41.479670, -81.768430],
                  ['Mahall\'s', 41.476989, -81.781094],
                  ['Szechwan Garden', 41.485615, -81.787890]
                 ]
        },
        park:{
          label:'parks',
          //the category may be default-checked when you want to
          //uncomment the next line
          //checked:true,
         icon:'images/map-marker/02.png',
          items: [
                  ['Lakewood Park', 41.494457, -81.797605],
                  ['Madison Park', 41.476969, -81.781929],
                  ['Tuland Park', 41.464052, -81.788041]
                 ]
        }  
      },

          infowindow = new google.maps.InfoWindow(),

          // a  div where we will place the buttons
          ctrl=$('<div/>').css({background:'#fff',
                                border:'1px solid #000',
                                padding:'4px',
                                margin:'2px',
                                textAlign:'center'
                               });
          //show all-button
          ctrl.append($('<input>',{type:'button',value:'show all'})
                        .click(function(){
                          $(this).parent().find('input[type="checkbox"]')
                            .prop('checked',true).trigger('change');
                        }));
          ctrl.append($('<br/>'));

          //clear all-button
          ctrl.append($('<input>',{type:'button',value:'clear all'})
                        .click(function(){
                          $(this).parent().find('input[type="checkbox"]')
                            .prop('checked',false).trigger('change');
                        }));
          ctrl.append($('<hr/>'));

          //now loop over the categories
          $.each(places,function(c,category){

            //a checkbox fo the category
            var cat=$('<input>',{type:'checkbox'}).change(function(){
               $(this).data('goo').set('map',(this.checked)?map:null);
            })
              //create a data-property with a google.maps.MVCObject
              //this MVC-object will do all the show/hide for the category 
              .data('goo',new google.maps.MVCObject)
              .prop('checked',!!category.checked)

              //this will initialize the map-property of the MVCObject
              .trigger('change')

              //label for the checkbox
              .appendTo($('<div/>').css({whiteSpace:'nowrap',textAlign:'left'})
                .appendTo(ctrl))
              .after(category.label);

              //loop over the items(markers)
              $.each(category.items,function(m,item){
                 var marker=new google.maps.Marker({
                        position:new google.maps.LatLng(item[1],item[2]),
                        title:item[0],
                        icon:category.icon
                      });

                 //bind the map-property of the marker to the map-property
                 //of the MVCObject that has been stored as checkbox-data 
                 marker.bindTo('map',cat.data('goo'),'map');
                 google.maps.event.addListener(marker,'click',function(){
                    infowindow.setContent(item[0]);
                    infowindow.open(map,this);
                 });
              });

          });

         //use the buttons-div as map-control 
         map.controls[google.maps.ControlPosition.TOP_RIGHT].push(ctrl[0]);
        }
    );


google.maps.event.addDomListener(window, 'load', map_init);

由于

0 个答案:

没有答案