Mapbox GL JS ImageSource 坐标错误

Question

我正在努力将图像正确定位到我的地图上。我正在为我的（实时）图像使用以下 URL 之一：

这些是相关的 WMS 功能：https://maps.dwd.de/geoserver/ows?service=wms&version=1.3.0&request=GetCapabilities

我尝试根据这个example 添加图像源。使用这些坐标：

[2.0714827302884133, 55.07980923136505],
[15.72075796095801, 55.07980923136505],
[15.72075796095801, 47.14423415016973],
[2.0714827302884133, 47.14423415016973]

问题是图像没有 100% 正确对齐，但稍微 shifted/stretched。我阅读了一些有关使用墨卡托投影的 Mapbox 的内容，但无法处理其他投影？这就是为什么上面有三个不同的 URL，但都失败了。接下来我尝试像这样转换我的坐标：

var westLongitude = 2.0714827302884133;
var eastLongitude = 15.72075796095801;  
var southLatitude = 47.14423415016973;
var northLatitude = 55.07980923136505;  

var topLeft = { lng: westLongitude, lat: northLatitude};
var mTopLeft = mapboxgl.MercatorCoordinate.fromLngLat(topLeft, 0).toLngLat();

var topRight = { lng: eastLongitude, lat: northLatitude};
var mTopRight = mapboxgl.MercatorCoordinate.fromLngLat(topRight, 0).toLngLat();

var bottomRight = { lng: eastLongitude, lat: southLatitude};
var mBottomRight = mapboxgl.MercatorCoordinate.fromLngLat(bottomRight, 0).toLngLat();

var bottomLeft = { lng: westLongitude, lat: southLatitude};
var mBottomLeft = mapboxgl.MercatorCoordinate.fromLngLat(bottomLeft, 0).toLngLat();

var mercatorCoordinates = [[mTopLeft.lng, mTopLeft.lat], [mTopRight.lng, mTopRight.lat], [mBottomRight.lng, mBottomRight.lat], [mBottomLeft.lng, mBottomLeft.lat]];

然而，这也没有正确对齐图像。我想，我使用了错误的坐标。知道如何做对吗？

非常感谢。

下面是可以玩的代码（请将雷达盲点（灰色）的位置与下图进行比较以查看偏移量）：js fiddle

这是雷达盲点（粉红色）必须位于的位置：

Answer 1

使用以下 coordinates/projection 似乎可行：

CRS=EPSG:3857&BBOX=614360.8293587392,5933210.01991552,1713821.866597408,7423590.537061271

这是另一个 js fiddle。

Mapbox GL JS ImageSource 坐标错误

Mapbox GL JS ImageSource wrong coordinates

coordinate-systems

mercator

mapbox

mapbox-gl-js