ol根据xyz确定地图瓦片位置

问题

因为偶尔有些奇怪的点位出现在意料之外的位置，导致移动到该点位所在位置没有下载对应的地图瓦片，所以需要判断该点位所处的位置（此时地图空白），作为参考信息。

解决思路

• 第一种是直接找出该点位，通过接口数据来查找对应的经纬度坐标，但比较繁琐，特别是数据量大时，很麻烦
• 第二种是我已经知道那些缺失瓦片的信息（根据接口报错得知瓦片的[z,x,y]）,通过tileCoord来判断点位的大概位置。

import {createXYZ} from 'ol/tilegrid';

const tilecoord = [11, 1689, 886]

const tilegrid = createXYZ();
const center = tilegrid.getTileCoordCenter(tilecoord) // 瓦片的中心位置

• 源码分析

/**
 * @param {import("../tilecoord.js").TileCoord} tileCoord Tile coordinate.
 * @return {import("../coordinate.js").Coordinate} Tile center.
 */
getTileCoordCenter(tileCoord) {
  const origin = this.getOrigin(tileCoord[0]);
  const resolution = this.getResolution(tileCoord[0]);
  const tileSize = toSize(this.getTileSize(tileCoord[0]), this.tmpSize_);
  return [
    origin[0] + (tileCoord[1] + 0.5) * tileSize[0] * resolution,
    origin[1] - (tileCoord[2] + 0.5) * tileSize[1] * resolution,
  ];
}

首先获取原点，分辨率，以及瓦片大小，在通过公式就算得出对应的瓦片中心点的经纬度坐标。

总结

记录下来得原因很简单，就是为了方便调试开发。虽然这个东西并不难，但需要你去了解openlayer的源码api，因为官网文档并没有直接点明。