Google Maps JS API v3 - 简单多标记+多段线

Question

我一直试图扩展this示例以包含多段线。到目前为止，我一直无法完成它的工作。我的代码目前看起来是这样的：

function initialize() { 
    var locations = [ 
     [12.239107980270559, 109.1947902572488, 'Nha Trang', 'Vietnam', '27/03/13', 1],        
     [11.938864949999937, 108.43334708999994, 'Dalat', 'Vietnam', '28/03/13', 2],        
     [10.76674113559709, 106.69295712387172, 'Ho Chi Minh', 'Vietnam', '02/04/13', 3],        
     [10.035511715481054, 105.78650841255843, 'Can Tho', 'Vietnam', '06/04/13', 4],        
     [10.379392700137583, 104.48601004588143, 'Ha Tien', 'Vietnam', '07/04/13', 5],        
     [10.607085236979454, 104.18364549108138, 'Kampot', 'Cambodia', '09/04/13', 6],        
     [10.615441163514843, 103.5214887207791, 'Sihanoukville', 'Cambodia', '12/04/13', 7],       
     [10.575040390060632, 103.54923875808034, 'Otres Beach', 'Cambodia', '15/04/13', 8] 
    ]; 
    var mapOptions = { 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    zoom: 9, 
    center: new google.maps.LatLng(10.575040390060632, 103.54923875808034), 
    panControl: false, 
    scaleControl: false, 
    mapTypeControl: false, 
    streetViewControl: false, 
    overviewMapControl: false, 
    zoomControl: true, 
    zoomControlOptions: { 
     style: google.maps.ZoomControlStyle.SMALL, 
     position: google.maps.ControlPosition.RIGHT_TOP 
    } 
    }; 
    var map = new google.maps.Map(document.getElementById("map"), mapOptions); 
    var infowindow = new google.maps.InfoWindow(); 
    var marker, poly, i; 
    for (i = 0; i < locations.length; i++) { 
    marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(locations[i][0], locations[i][1]), 
     map: map 
    }); 
    poly = new google.maps.Polyline({ 
     path: new google.maps.LatLng(locations[i][0], locations[i][1]), 
     strokeColor: '#000000', 
     strokeOpacity: 1.0, 
     strokeWeight: 3 
    }); 
    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
     return function() { 
     infowindow.setContent(locations[i][2]); 
     infowindow.open(map, marker); 
     } 
    })(marker, i)); 
    } 
} 
function loadScript() { 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.src = "http://maps.googleapis.com/maps/api/js?key=AIzaSyAhnheFVYaMG44DfbXYCuNmKHuf15Ar1_I&sensor=true&callback=initialize"; 
    document.body.appendChild(script); 
} 
window.onload = loadScript; 

我想这个问题是与阵列因为它没有这样做（根据谷歌文档）的标准方法，我只是不知道如何正确地调用它。任何帮助是极大的赞赏。

Answer 1

您需要将多段线的创建移出循环，并向其提供LatLng对象数组。

var arr = []; 
for (var i = 0; i < locations.length; i++) { 
    var marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(locations[i][0], locations[i][1]), 
     map: map 
    }); 
    arr.push(marker.getPosition()); 

    // <-- snipped --> 
} 

Edit: 

    var poly = new google.maps.Polyline({ 
     path: arr, 
     strokeColor: '#000000', 
     strokeOpacity: 1.0, 
     strokeWeight: 3, 
     map: map  
    });