Внедрение нескольких маркеров с помощью Google Maps Api

Создание сайта с использованием WordPress, сайт был запрограммирован для отображения одного маркера на карте и списка других местоположений ниже. В конечном итоге я хочу удалить описание под картой и просто указать места, указанные вместе с картой и отмеченными на ней маркерами.Внедрение нескольких маркеров с помощью Google Maps Api

<body> 
    <div class="corporateMap"></div> 
</body> 
<script src='https://maps.googleapis.com/maps/api/js?key=&sensor=false&extension=.js'></script> 
      <script> 
       google.maps.event.addDomListener(window, 'load', init); 
       var map; 
       var locationPhone= '<?php echo $locationPhone; ?>'; 
       var locationTitle = '<?php echo $locationTitle; ?>'; 
       var locationLat = '<?php echo $locationLat; ?>'; 
       var locationLong = '<?php echo $locationLong; ?>'; 
       function init() { 
        var mapOptions = { 
         center: new google.maps.LatLng(locationLat,locationLong), 
         zoom: 15, 
         zoomControl: true, 
         zoomControlOptions: { 
          style: google.maps.ZoomControlStyle.DEFAULT, 
         }, 
         disableDoubleClickZoom: true, 
         mapTypeControl: true, 
         mapTypeControlOptions: { 
          style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR, 
         }, 
         scaleControl: true, 
         scrollwheel: false, 
         panControl: false, 
         streetViewControl: false, 
         draggable : true, 
         overviewMapControl: false, 
         overviewMapControlOptions: { 
          opened: false, 
         }, 
         mapTypeId: google.maps.MapTypeId.ROADMAP, 
         styles: [ 
       { stylers: [{ saturation: -100 }, { gamma: 1 }] }, 
       { elementType: "labels.text.stroke", stylers: [{ visibility: "off" }] }, 
       { featureType: "poi.business", elementType: "labels.text", stylers: [{ visibility: "off" }] }, 
       { featureType: "poi.business", elementType: "labels.icon", stylers: [{ visibility: "off" }] }, 
       { featureType: "poi.place_of_worship", elementType: "labels.text", stylers: [{ visibility: "off" }] }, 
       { featureType: "poi.place_of_worship", elementType: "labels.icon", stylers: [{ visibility: "off" }] }, 
       { featureType: "road", elementType: "geometry", stylers: [{ visibility: "simplified" }] }, 
       { featureType: "water", stylers: [{ visibility: "on" }, { saturation: 50 }, { gamma: 0 }, { hue: "#50a5d1" }] }, 
       { featureType: "administrative.neighborhood", elementType: "labels.text.fill", stylers: [{ color: "#333333" }] }, 
       { featureType: "road.local", elementType: "labels.text", stylers: [{ weight: 0.5 }, { color: "#333333" }] }, 
       { featureType: "transit.station", elementType: "labels.icon", stylers: [{ gamma: 1 }, { saturation: 50 }] } 
      ], 
        } 
        var mapElement = document.getElementById('corporateMap'); 
        var map = new google.maps.Map(mapElement, mapOptions); 
        var locations = [ 
      [locationTitle, 'undefined', locationPhone, 'undefined', 'http://www.fptscrap.com/', locationLat, locationLong] 
        ]; 
        for (i = 0; i < locations.length; i++) { 
         if (locations[i][1] =='undefined'){ description ='';} else { description = locations[i][1];} 
         if (locations[i][2] =='undefined'){ telephone ='';} else { telephone = locations[i][2];} 
         if (locations[i][3] =='undefined'){ email ='';} else { email = locations[i][3];} 
         if (locations[i][4] =='undefined'){ web ='';} else { web = locations[i][4];} 
         marker = new google.maps.Marker({ 
          icon: '', 
          position: new google.maps.LatLng(locations[i][5], locations[i][6]), 
          map: map, 
          title: locations[i][0], 
          desc: description, 
          tel: telephone, 
          email: email, 
          web: web 
         }); 
         bindInfoWindow(marker, map, locations[i][0], description, telephone, email, web); 
        } 
      function bindInfoWindow(marker, map, title, desc, telephone, email, web) { 
      if (web.substring(0, 7) != "http://") { 
      link = "http://" + web; 
      } else { 
      link = web; 
      } 
        google.maps.event.addListener(marker, 'click', function() { 
         var html= "<div style='color:#000;background-color:#fff;padding:5px;width:210px;'><h4>"+title+"</h4><p>"+telephone+"<p><a href='"+link+"'' >"+web+"<a></div>"; 
         iw = new google.maps.InfoWindow({content:html}); 
         iw.open(map,marker); 
        }); 
       } 
      } 
      </script> 
     <?php } else { 

     } ?>

источник

2014-11-12 user1877163

укажите правильный код. здесь нет html-кода –

код уже размещает все маркера на карте, если она присутствует, проблема заключается в этих строках:

  var locationPhone= '<?php echo $locationPhone; ?>'; 
      var locationTitle = '<?php echo $locationTitle; ?>'; 
      var locationLat = '<?php echo $locationLat; ?>'; 
      var locationLong = '<?php echo $locationLong; ?>';

Здесь вам нужно изменить PHP часть эха массива мест (или если вы не хотите/не можете получить доступ к php только для жесткого кода), а затем назначить новый массив здесь:

  var locations = [ 
      [locationTitle, 'undefined', locationPhone, 'undefined', 'http://www.fptscrap.com/', locationLat, locationLong] 
     ];

источник

2015-01-28 10:43:20

Внедрение нескольких маркеров с помощью Google Maps Api

ответ

Смежные вопросы