Google Maps Polyline仅绘单点不绘折线的问题求助

嘿，你遇到的问题根源很简单：循环里一直重复取同一个经纬度值，导致poly数组里全是同一个点，Google Maps自然只能显示一堆重叠的点，而不是折线。

问题代码的错误点 #

看你这段循环代码：

for (var j = 0; j<p.Cot.length; j++) { 
  var pos = new google.maps.LatLng(p.Cot[0],p.Cot[1]) 
  poly.push(pos); 
}

不管j怎么变化，你始终用p.Cot[0]和p.Cot[1]，相当于每次都把第一个坐标点塞进数组里。数组里全是重复的点，当然连不成线啦！

修改后的正确代码 #

假设p.Cot是一个二维数组，每个元素是[纬度, 经度]的格式，你需要在循环里用j来索引每个坐标对：

var poly = new Array(); 
for (var j = 0; j < p.Cot.length; j++) { 
  // 这里用j来获取当前循环的坐标对，而不是固定的0和1
  var pos = new google.maps.LatLng(p.Cot[j][0], p.Cot[j][1]); 
  poly.push(pos); 
} 
var Path = new google.maps.Polyline({ 
  path: poly, 
  geodesic: true, 
  strokeColor: '#ff004c', 
  strokeOpacity: 1.0, // 补充你没写完的属性，比如透明度
  strokeWeight: 2     // 折线宽度，让线条更明显
});
// 别忘了把折线添加到地图上！
Path.setMap(yourMapInstance); // 替换成你的地图实例变量名

额外提醒 #

1. 确保p.Cot数组里的每个元素都是有效的经纬度对，格式正确；
2. 最后一定要调用setMap()方法把折线添加到你的地图实例上，不然折线不会显示；
3. 如果p.Cot的结构是对象数组（比如每个元素是{lat: xxx, lng: xxx}），那代码要改成：

var pos = new google.maps.LatLng(p.Cot[j].lat, p.Cot[j].lng);

内容的提问来源于stack exchange，提问作者kdawg