谷歌地图标记上的setVisible

时间:2016-04-18 15:13:51

标签: javascript google-maps google-maps-api-3 google-maps-markers

所以我使用initialize()函数制作谷歌地图,我希望它用addMarker()函数绘制标记,但是将它们设置为不可见,这样我可以在以后看到它们。 但是如果我在新的google.maps.Marker()中设置了setVisible:false,它会同时显示它们,如果我将它设置为true,它只显示其中一个。如何?

这是我的代码:

    <!DOCTYPE html>
    <html>
      <head>
    <script src="http://maps.googleapis.com/maps/api/js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
    //varijable
    var restorani = [
        ['restoran 1',45.158457,18.0158902,'Prvi'],
        ['restoran 2',45.159457,18.0158902,'Drugi']
    ];

    var myCenter=new google.maps.LatLng(45.159457,18.0158902);
    var map;
    var i;
//initialize
    function initialize() {
      var mapProp = {
        center:new google.maps.LatLng(45.159457,18.0158902),
        zoom:13,
        mapTypeId:google.maps.MapTypeId.ROADMAP
      };
      map=new google.maps.Map(document.getElementById("map"),mapProp); 
    for(i=0;i<2;i++){
    addMarker(restorani[i]);

     }

  } 

google.maps.event.addDomListener(window, 'load', initialize);
//adding markers    
    function addMarker(marker) {
    var category = marker[0];
    var titl= marker[3];
    var pos = new google.maps.LatLng(marker[1], marker[2]); 
    var marker = new google.maps.Marker({
        position: pos,
        category: category,
        map: map,
        title: titl,
        setVisible:false //!!!!!!!!!!!!!!!!!!

    });
}   



    </script>
    </head>
<style>
          #map {
                width: 700px;
                height: 400px;
                float:right;
                border:2px solid black;
          }
    </style>
     </head>

      <body>
      <div id="map"></div>
      </body>
    </html>

1 个答案:

答案 0 :(得分:0)

property namevisible,而不是setVisible

function addMarker(marker) {
  var category = marker[0];
  var titl= marker[3];
  var pos = new google.maps.LatLng(marker[1], marker[2]); 
  var marker = new google.maps.Marker({
    position: pos,
    category: category,
    map: map,
    title: titl,
    visible:false
});

代码段

&#13;
&#13;
//varijable
var restorani = [
  ['restoran 1', 45.158457, 18.0158902, 'Prvi'],
  ['restoran 2', 45.159457, 18.0158902, 'Drugi']
];

var myCenter = new google.maps.LatLng(45.159457, 18.0158902);
var map;
var i;
//initialize
function initialize() {
  var mapProp = {
    center: new google.maps.LatLng(45.159457, 18.0158902),
    zoom: 13,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("map"), mapProp);
  for (i = 0; i < 2; i++) {
    addMarker(restorani[i]);

  }
}

google.maps.event.addDomListener(window, 'load', initialize);
//adding markers    
function addMarker(marker) {
  var category = marker[0];
  var titl = marker[3];
  var pos = new google.maps.LatLng(marker[1], marker[2]);
  var marker = new google.maps.Marker({
    position: pos,
    category: category,
    map: map,
    title: titl,
    visible: false

  });
}
google.maps.event.addDomListener(window, "load", initialize);
&#13;
#map {
  width: 700px;
  height: 400px;
  float: right;
  border: 2px solid black;
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<div id="map"></div>
&#13;
&#13;
&#13;