javascript - 如何在谷歌地图上添加两个位置的标记？

Question

我想在谷歌地图上添加两个可点击的位置的标记。当我单击按钮时，它应该使用位置更改地图标记。

 <script>
    var map;
    function initialize()
    {
        map = new google.maps.Map(document.getElementById('map-canvas'), {
            center: new google.maps.LatLng(52.302516, 16.414546), //Setting Initial Position
            zoom: 14,

        });
        var marker = new google.maps.Marker({
            position: newLocation(),
            map: map,
            title: 'AGM-CORP',
            icon: 'img/agm-marker.png'
        });
    }

    function newLocation(newLat, newLng)
    {
        map.setCenter({
            lat: newLat,
            lng: newLng
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);
    $(document).ready(function ()
    {
        $("#1").on('click', function ()
        {
            newLocation(52.302516, 16.414546);
        });

        $("#2").on('click', function ()
        {
            newLocation(51.706478, 15.274753);
        });
    });
</script>
<div id="map-canvas"></div>
</div>
    <h3>Zobacz lokalizację:</h3>
    <button id="1" style="padding:10px; cursor:pointer;">Siedziba Firmy</button>
    <button id="2" style="padding:10px;cursor:pointer;">Kopalnia Kruszyw</button>
</div>

标签： javascriptjquerygoogle-mapslocationgoogle-maps-markers

Answer 1

这个函数只会切换视图的位置：

map.setCenter({
   lat: newLat,
   lng: newLng
});

改用这个：

new google.maps.LatLng(-25.363882,131.044922);

其次，您需要将事件侦听器添加到标记对象以使其正常工作：

// create markers on the map
marker1 = new google.maps.Marker({ ... })
marker2 = new google.maps.Marker({ ... })
marker3 = new google.maps.Marker({ ... })

// add event listener
marker1.addListener('click', function() { ... })
marker2.addListener('click', function() { ... })

进一步查看文档，它们非常简单。