添加标记以映射按钮单击并将标记限制为一个

Question

我在地图上有一个添加标记按钮。当我单击鼠标并将鼠标放在地图上时，我必须做以下事情

1）我的鼠标图标应从手形符号更改为+

2）显示方向和鼠标移动时的经纬度。像这样

3）当我单击任何位置时，我应该能够在该位置添加标记。

4）我应该只能在单击按钮时添加一个标记

5）添加标记后，我必须在搜索文本框中显示该标记的经纬度值

这是我的代码：

function myMap() {
  var myCenter = new google.maps.LatLng(56.1304, -106.3468);
  var mapProp = {
    center: myCenter,
    zoom: 6,
    scrollwheel: true,
    draggable: true,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById("map"), mapProp);
  
   google.maps.event.addListener(map, 'click', function (event)     {
        placeMarker(event.latLng);
    });

    function placeMarker(location) {
        var marker = new google.maps.Marker({
            position: location,
            animation: google.maps.Animation.DROP,
            map: map
        });
    }
}

<div id="map" style="height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; "></div>
<div>
    <input id="searchtext" type="text" value=" " class="search-text" placeholder="Enter your search location here" style="z-index: 0; position: absolute; left: 125px; top: 0px;">
</div>


<div class="tool" id="addmarker" data-color='blue' style="z-index: 0; position: absolute; left: 0px; top: 289px;">
    <img id="addmarkerbutton" class="map-tool-icon" title="Add Marker" src="~/Images/search.png" alt="Add Marker">
</div>

Answer 1

您可以检查是否已添加带有全局变量的标记

并添加用于管理鼠标移动的列表器。

[2 Reassembled TCP Segments (542 bytes): #11629(281), #11631(261)]