【问题标题】:Add marker to Google Map on Click单击时将标记添加到 Google 地图
【发布时间】:2013-03-25 10:22:28
【问题描述】:

当用户在地图上单击鼠标左键时,我很难找到一个非常简单的示例来说明如何向 Google 地图添加标记。

过去几个小时我已经环顾四周,并查阅了 Google Maps API 文档,希望能得到一些帮助!

【问题讨论】:

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


    【解决方案1】:

    经过深入研究,我设法找到了解决方案。

    google.maps.event.addListener(map, 'click', function(event) {
       placeMarker(event.latLng);
    });
    
    function placeMarker(location) {
        var marker = new google.maps.Marker({
            position: location, 
            map: map
        });
    }
    

    【讨论】:

    • 我们可以让用户只能添加一次吗?并移动标记?
    • 请提供示例链接
    【解决方案2】:

    2017年,解决办法是:

    map.addListener('click', function(e) {
        placeMarker(e.latLng, map);
    });
    
    function placeMarker(position, map) {
        var marker = new google.maps.Marker({
            position: position,
            map: map
        });
        map.panTo(position);
    }
    

    【讨论】:

      【解决方案3】:

      这实际上是一个文档化的功能,可以在here找到

      // This event listener calls addMarker() when the map is clicked.
        google.maps.event.addListener(map, 'click', function(e) {
          placeMarker(e.latLng, map);
        });
      
        function placeMarker(position, map) {
          var marker = new google.maps.Marker({
            position: position,
            map: map
          });  
          map.panTo(position);
        }
      

      【讨论】:

        【解决方案4】:

        @Chaibi Alaa,让用户只能添加一次,并移动标记;您可以在第一次点击时设置标记,然后在后续点击时更改位置。

        var marker;
        
        google.maps.event.addListener(map, 'click', function(event) {
           placeMarker(event.latLng);
        });
        
        
        function placeMarker(location) {
        
            if (marker == null)
            {
                  marker = new google.maps.Marker({
                     position: location,
                     map: map
                  }); 
            } 
            else 
            {
                marker.setPosition(location); 
            } 
        }
        

        【讨论】:

          【解决方案5】:

          目前将监听器添加到地图的方法是

          map.addListener('click', function(e) {
              placeMarker(e.latLng, map);
          });
          

          不是

          google.maps.event.addListener(map, 'click', function(e) {
              placeMarker(e.latLng, map);
          });
          

          Reference

          【讨论】:

            【解决方案6】:
            1. 首先声明标记:
            this.marker = new google.maps.Marker({
               position: new google.maps.LatLng(12.924640523603115,77.61965398949724),
               map: map
            });
            
            1. 调用方法以在点击时绘制标记:
            this.placeMarker(coordinates, this.map);
            
            1. 定义函数:
            placeMarker(location, map) {
                var marker = new google.maps.Marker({
                    position: location,
                    map: map
                });
                this.markersArray.push(marker);
            }
            

            【讨论】:

              猜你喜欢
              • 2014-08-07
              • 1970-01-01
              • 2017-09-14
              • 2012-10-27
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              相关资源
              最近更新 更多