高德地图 Polyline 如何跨越180度经线的问题

高德地图 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经度线的效果了