Mark multiple locations in Google Map

问题

I am using Google map api v3 to plot markers of location array. My script is

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);
        }

where markers variable is bringing proper data, my test data is array of 5 elements

1. The Game Larder, 24 The Parade, Claygate, Surrey,KT10 0NU
2. 24 The Parade, Claygate, Esher, Surrey KT10 0NU
3. Card Collection, 14 The Parade, Claygate, ESHER, KT10 0NU

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

   and same is coming into array markers however it is plotting only two markers. What could be wrong here

Solution

I was entering locations which are very close to each other e.g 1 and 2 point which gives same latlong hence mark as one place. I found latlong here. Thanks for answers btw :)

回答1:

In page.aspx. insert tag <div id="map-canvas" ></div>

view source page.aspx and insert script into it>

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);
                }
            });
        }

there are difference with your code:

1: var lis_marker = new Array();

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

来源：https://stackoverflow.com/questions/24629603/mark-multiple-locations-in-google-map