主页 / 问题 / 555117
Accepted
Карен
Asked:2020-08-13 23:50:24 +0000 UTC2020-08-13 23:50:24 +0000 UTC

单击链接时如何使标记出现在地图上？

  • 772

我怎样才能在谷歌地图中实现与此处相同的行为？
Yandex.Maps：显示地图对象列表

我想在点击链接时在地图上显示一个标记。
提前致谢。

google-maps

1 个回答

  1. Best Answer

    这个问题可能不再相关，但也许有人会需要它。

    <script src="https://maps.googleapis.com/maps/api/js?libraries=places&key=your_api_key_here"></script>

    获取密钥：API KEY GOOGLE

    JavaScript 代码

    <script type="text/javascript">
var geocoder;
var map;
var query = new Array('Красная Площадь, Красная площадь, Москва, Россия', 'Триумфальная пл., 2, Москва, Россия', 'ул. Маросейка, 9/2, стр. 1, Москва, Россия'); //Адреса на карте
var idArr = new Array('marker1','marker2','marker3');

function initialize() {
  geocoder = new google.maps.Geocoder();
  var mapOptions = {
    zoom: 15
  }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  codeAddress();
}

function codeAddress() {
    for (var i = 0; i < query.length; i++) {
        var address = query[i];
        geocoder.geocode({
                'address': address
            }, function(k) {
                return function(results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                        var a = document.getElementById(idArr[k]);
                        a.onclick = function() {
                            map.setZoom(17);
                            map.setCenter(results[0].geometry.location);
                        }
                        map.setCenter(results[0].geometry.location);
                        var marker = new google.maps.Marker({
                            map: map,
                            position: results[0].geometry.location
                        });
                    } else {
                        alert('Геокод не был успешным по следующей причине: ' + status);
                    }
                }
            }(i)
        );
    }
}

google.maps.event.addDomListener(window, 'load', initialize);
 </script>

    HTML

    <body>
    <div id="map-canvas"  style="width: 600px; height: 400px"></div>
    <div class="maps-marker">
        <a href="#!" id="marker1">Красная площадь</a>
        <a href="#!" id="marker2">Театр Сатиры</a>
        <a href="#!" id="marker3">Макдоналдс</a>
    </div>
</body>

    结果：

    在此处输入图像描述

    • 0

相关问题