You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

MapLibre-GL中EPSG:3857转EPSG:3395时瓦片加载异常的问题求助

MapLibre-GL中EPSG:3857转EPSG:3395时瓦片加载异常的问题求助

各位好,我最近在做MapLibre-GL的瓦片加载适配,遇到了个头疼的问题:当我把地图坐标系从默认的EPSG:3857切换到EPSG:3395时,始终加载不到正确的瓦片。反复对比后发现,生成的瓦片路径里只有y值对应的瓦片是错的,x和zoom部分看起来都没问题,但就是y值不对导致瓦片位置完全偏移。

我先贴一下我当前用的坐标转换函数,麻烦大家帮忙看看哪里出了问题:

const transformCoord = function (_, z, x, y) {
  const zoomStr = "L" + (z - 2).toString().padStart(2, "0");
  const { lng, lat } = this.map.unproject({ x, y });
  const convertLnglat = proj4("EPSG:3857", "EPSG:3395", [lng, lat]);
  const convertedObj = this.map.project(convertLnglat);
  const xStr = "C" + Number(Math.round(convertedObj.x)).toString(16).padStart(8, "0");
  const yStr = "R" + Number(Math.round(convertedObj.y)).toString(16).padStart(8, "0");
  return `/${zoomStr}/${yStr}/${xStr}`;
};

我的思路是这样的:

  • 先通过unproject把当前瓦片的像素坐标转成EPSG:3857的经纬度
  • 用proj4把这个经纬度转换成EPSG:3395的坐标
  • 再用project把转换后的坐标转回像素坐标,最后生成服务端要求的瓦片路径格式

现在的问题就是y值计算出来总是不对,有没有大佬能帮我排查下?是不是我对MapLibre的project/unproject方法理解错了?或者坐标系转换的步骤里有什么容易忽略的细节?

提前谢谢大家了!

火山引擎 最新活动