听JS点击谷歌地图特定点

时间:2017-12-11 06:13:02

标签: javascript google-maps

我镇上有超过1000盏路灯,它们都保存在MYSQL表中。对于记录特定故障路灯的人,我需要显示它们并允许用户点击故障路灯以获得路灯的坐标。

有人可以帮我解决如何在谷歌地图中的特定点上点击鼠标,以便获得经度和纬度吗?

非常感谢提前。

1 个答案:

答案 0 :(得分:0)

要在地图上显示它们并响应这些特定路灯的点击,我们可以遍历您存储的位置,并通过向这些标记添加点击事件监听器为您的所有灯光添加标记。

这是一个包含两个latlon对象数组的示例,用于说明如何遍历您的位置并将事件处理程序附加到所有标记。

<div id="map" style="height:200px;"></div>
<script>
      var map;
      var lightLocations = [
          {lat: -34.397, lng: 150.644},
          {lat: -34.350, lng: 150.704}
      ];

      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 10
        });
        var markerClicked = function(event) {
            // here's where you do what you need to do with the info
            alert(this.position);
        }
        lightLocations.forEach( function(element) {
            var marker = new google.maps.Marker({
                 position: element,
                 map: map
            });
            marker.addListener( 'click', markerClicked );
        });

      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?callback=initMap"
    async defer></script>