更新后,Google Maps API v3 Polyline不会显示

时间:2012-09-19 08:10:03

标签: javascript google-maps-api-3 maps google-maps-markers google-polyline

我想在谷歌地图上绘制带有折线的标记作为它们之间的连接。但 我无法在谷歌地图上显示我的折线。我已将折线和地图初始化为全局变量。标记显示但折线不呈现。

function initialize() {
var mapOptions = {
    zoom : 13,
    center : oldenburg,
    mapTypeId : google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var polyOptions = {
        strokeColor : '#FF3333',
        strokeOpacity : 1.0,
        strokeWeight : 3
    };
    path = new google.maps.Polyline(polyOptions);
    path.setMap(map);
}
function addPlaces(orte) {

for ( var i = 0; i < orte.length; i++) {
    var ort = toLatLng(orte[i][0], orte[i][1]);
     path.getPath().push(ort);

    marker = new google.maps.Marker({
        position : ort,
        title : '#' + orte[i][2],
        icon : image,
        map : map
    });
}

}

1 个答案:

答案 0 :(得分:2)

在实例化折线时尝试并指定路径:

示例: Google示例坐标

var flightPlanCoordinates = [
    new google.maps.LatLng(37.772323, -122.214897),
    new google.maps.LatLng(21.291982, -157.821856),
    new google.maps.LatLng(-18.142599, 178.431),
    new google.maps.LatLng(-27.46758, 153.027892)
  ];

使用代码上的坐标作为示例

var polyOptions = {
    path: flightPlanCoordinates, //IMPORTANT TO SET the PATH for the line to RENDER
    strokeColor : '#FF3333',
    strokeOpacity : 1.0,
    strokeWeight : 3
};

或使用上述坐标作为Google文档示例:

 var flightPath = new google.maps.Polyline({
    path: flightPlanCoordinates,
    strokeColor: "#FF0000",
    strokeOpacity: 1.0,
    strokeWeight: 2
  });