如何使用OpenLayers绘制向西延伸而非向东的线条？

问题核心：OpenLayers在经纬度投影（EPSG:4326）下，默认会绘制两点间的最短路径。你当前的起点[-82,42]（西经82）到终点[10,45]（东经10），向东的经度差仅92度，比向西的268度短，所以默认走了向东的路径。要实现向西延伸的效果，只需让路径走经度减小的方向，具体方案如下：

解决方案：调整终点坐标（将东经转为等效西经） #

把终点的经度减去360度，将东经10度转换为等效的西经350度（即10 - 360 = -350），这样坐标数组的经度从-82（西经82）到-350（西经350），线条就会沿着向西的方向绕地球绘制。

修改后的JavaScript代码：

let coordinates = [
  [-82, 42],
  [-350, 45] // 原[10,45]改为-350,45
];
            
const myFeature = new ol.Feature({
  geometry: new ol.geom.LineString(coordinates),
  name: "Line"
});

myFeature.setStyle(
  new ol.style.Style({ stroke: new ol.style.Stroke({ color: "green", width: 8 }) })
);

const vectorSource = new ol.source.Vector({
  features: [myFeature]
});

const vectorLayer = new ol.layer.Vector({
  source: vectorSource
});

const map = new ol.Map({
  target: "map",
  layers: [
    new ol.layer.Tile({
      source: new ol.source.OSM()
    }),
    vectorLayer
  ],
  view: new ol.View({
    projection: 'EPSG:4326',
    center: [-50, 43.5],
    zoom: 1
  })
});

原理说明 #

当坐标的经度差绝对值超过180度时，OpenLayers会绘制更长的那条路径。调整后起点到终点的经度差为-350 - (-82) = -268（负数表示向西），差值绝对值大于180，所以线条会沿着向西的方向延伸，和你手绘的红色线条效果一致。

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