繁体   English   中英

谷歌地图 API - 获取标记详细信息

[英]Google Maps API - Get marker details

每次单击标记时,我都会尝试在 web 页面上打印地名。

我试过这段代码来显示多个标记:

function initMap() {
  var center = {lat: 34.052235, lng: -118.243683};  var locations = [
    ['Coffee 1<br>\
    801 S Hope St A, Los Angeles, CA 90017<br>\
   <a href="https://goo.gl/maps/L8ETMBt7cRA2">Get Directions</a>',   34.046438, -118.259653],
    ['Coffee 2<br>\
    525 Santa Monica Blvd, Santa Monica, CA 90401<br>\
   <a href="https://goo.gl/maps/PY1abQhuW9C2">Get Directions</a>', 34.017951, -118.493567],
    ['Coffee 3<br>\
    146 South Lake Avenue #106, At Shoppers Lane, Pasadena, CA 91101<br>\
    <a href="https://goo.gl/maps/eUmyNuMyYNN2">Get Directions</a>', 34.143073, -118.132040],
    ['Coffee 4<br>\
    21016 Pacific Coast Hwy, Huntington Beach, CA 92648<br>\
    <a href="https://goo.gl/maps/Cp2TZoeGCXw">Get Directions</a>', 33.655199, -117.998640],
    ['Coffee 5<br>\
    252 S Brand Blvd, Glendale, CA 91204<br>\
   <a href="https://goo.gl/maps/WDr2ef3ccVz">Get Directions</a>', 34.142823, -118.254569]
  ];var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 9,
    center: center
  });var infowindow =  new google.maps.InfoWindow({});var marker, count;for (count = 0; count < locations.length; count++) {
    marker = new google.maps.Marker({
      position: new google.maps.LatLng(locations[count][1], locations[count][2]),
      map: map,
      title: locations[count][0]
    });google.maps.event.addListener(marker, 'click', (function (marker, count) {
      return function () {
        infowindow.setContent(locations[count][0]);
        infowindow.open(map, marker);
      }
    })(marker, count));
  }
}

现在每次我点击一个标记我都想显示他的名字,比如:

<p>You picked: Coffee1</p>

我怎样才能提取这些信息? 谢谢你。

在这里,我们将侦听器添加到标记。

google.maps.event.addListener(marker,"click",setInfoWindow)
 

此 function 在单击任何标记时运行。

function setInfoWindow(){

    infowindow.close(); // Firstly close(dispose) infowindow
    infowindow.setContent(`<p>You picked: ${this.title}</p>`) // Set your marker content
    infowindow.open(map,this); // Open InfoWindow

}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM