在谷歌地图上标记多个位置

Mark multiple locations in Google Map

本文关键字:位置 谷歌地图 上标      更新时间:2023-09-26

我使用Google map api v3来绘制位置数组的标记。我的脚本是

function OnSuccess(response) {
            var markers = response.d.split('^^');
            var latlng = new google.maps.LatLng(51.474634, -0.195791);
            var mapOptions1 = {
                zoom: 14,
                center: latlng
            }
            var geocoder = new google.maps.Geocoder();
            var infoWindow = new google.maps.InfoWindow();
            var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions1);
            for (i = 0; i < markers.length; i++) {
                var data = markers[i];
                
                geocoder.geocode({ 'address': data }, function (results, status) {
                    if (status == google.maps.GeocoderStatus.OK) {
                        map.setCenter(results[0].geometry.location);
                        
                        var marker = new google.maps.Marker({
                            map: map,
                            position: results[0].geometry.location,
                            title: data  
                        });
                       
                    } else {
                        alert("Geocode was not successful for the following reason: " + status);
                    }
                });
            }
            (function (marker, data) {
                // Attaching a click event to the current marker
                google.maps.event.addListener(marker, "click", function (e) {
                    infoWindow.setContent(data);
                    infoWindow.open(map, marker);
                });
            })(marker, data);
        }

其中markers变量带来适当的数据,我的测试数据是5个元素的数组

  1. The Game Larder, 24 The Parade, Claygate, Surrey,KT10 0NU

  2. 24 The Parade, Claygate, Esher, Surrey KT10 0NU

  3. 卡片集,14游行,克莱盖特,ESHER, KT10 0NU

  4. 16A The Parade, Claygate, ESHER, KT10 0NU

    和相同的是进入阵列markers,但它正在绘制只有两个标记。这里出了什么问题

<

解决方案/strong>

我正在进入彼此非常接近的位置,例如1和2点,这给出了相同的latlong,因此标记为一个地方。我在这里找到了latlong。谢谢你的回答:)

In page.aspx。插入标签<div id="map-canvas" ></div>

查看源代码页。>

var lis_marker = new Array();
for (i = 0; i < markers.length; i++) {
            var data = markers[i];
            geocoder.geocode({ 'address': data }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {
                    map.setCenter(results[0].geometry.location);

                    lis_marker[i] = new google.maps.Marker({
                        map: map,
                        position: results[0].geometry.location,
                        title: data  
                    });

                } else {
                    alert("Geocode was not successful for the following reason: " + status);
                }
            });
        }

与您的代码有差异:

1: var lis_marker = new Array();

2: lis_marker[i] = new google.maps.Marker({...});