高德地图 Polyline 如何跨越180度经线的问题
如果采用一条线则会环绕地图一周;
如果采用两条线则是只能显示180度经线一侧的polyline,不能全部显示
急求
高德地图 Polyline 如何跨越180度经线的问题
如果采用一条线则会环绕地图一周;
如果采用两条线则是只能显示180度经线一侧的polyline,不能全部显示
急求
经过测试,polyline的path属性需要输入的是一个对象数组,对象类型为{Q:null,R:null,lat:null,lng:null},我们一般调用是path属性直接传入对象是一个数组,即[lng,lat]这个样子,会被自动转换为对象类型。而自动转换中,会把经度值lng固定在[-180,180]范围内,所以就会出现不能够跨越180经度线的问题。例如,如果想要画出[175,20],[185,20]的线,输入应该是[175,20],[185,20],但是在类型转换时,系统会把[185,20]转换为[-175,20],就会造成前一个点向西绕地球几乎一圈的连线。解决方案就是不传入数组元素,而是直接传入转换后的对象元素。
polyline部分的代码
Polyline = new AMap.Polyline({
map: map, //指定目标地图
path: inputPath, //折线的节点坐标数组
showDir: true, //是否延路径显示白色方向箭头,默认false(Canvas绘制时有效,建议折线宽度大于6时使用)
strokeColor: "#D3D3D3", //线颜色
strokeOpacity: 1, //线透明度
strokeWeight: 6, //线宽
// strokeStyle: "solid" //线样式
});
假如之前传入的inputPath为
inputPath = [[155,23],[175,20],[185,20]];
现在应该直接传入对象
//AMap.LngLat()中第三个参数true,就是为了防止系统自动把185转换为-175,造成折线不能跨180经度线的情况
inputPath = [];
inputPath.push(new AMap.LngLat(155,23, true));
inputPath.push(new AMap.LngLat(175,20, true));
inputPath.push(new AMap.LngLat(185,20, true));
现在画折线图就可以完成跨180经度线的效果了