主页 / coding / 问题 / 79282393
Accepted
Tamas Ferenci
Asked: 2024-12-15 21:22:14 +0800 CST

在 Openlayers 中获取 XYZ 源的中心（或范围）

  • 772

是否有可能在 Openlayers 中获取 XYZ 源的中心（或范围）？（我不是说获取视图的中心，而是获取源本身定义的地图的中心。）确实VectorSource有一个getExtent函数，但不幸的是 XYZ 没有这样的方法。

不幸的是，使用source.getTileGrid().getExtent()似乎不起作用；这是一个最小的可重现的例子：

<!DOCTYPE html>
<html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ol.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/ol.css">
</head>
<body>
    <div id="map" class="map"></div>
    <script type="text/javascript">
        const src = new ol.source.XYZ({
            url: 'https://s3.eu-central-1.amazonaws.com/old-maps/the-hague-1944/tiles/{z}/{x}/{y}.jpg'
        })
        const ext = src.getTileGrid().getExtent();
        console.log(ext);
    </script>
</body>
</html>

（我用的是这张地图。）

返回的结果[-20037508.342789244, -20037508.342789244, 20037508.342789244, 20037508.342789244]好像中心是 [0, 0, 0, 0]。当然事实并非如此，如果我使用不同的地图，结果将是完全相同的范围。

openlayers

1 个回答

  1. Best Answer

    您的代码使用默认的全局图块网格，并将尝试以任何缩放级别加载世界上任何地方的图块。除非您能够运行脚本

    # Get the geographic coordinates of the file's left top and right bottom 
lt = mercantile.lnglat(gt[0], gt[3])
rb = mercantile.lnglat(gt[0] + (ds.RasterXSize * gt[1]), 
                       gt[3] + (ds.RasterYSize * gt[5]))

    您需要使用测试地图来查看图块的加载位置和缩放级别，方法是将其与 TileDebug 层叠加。这表明图块的可用缩放级别为 10 到 16，在级别 16 下 X 值的范围为 33503 到 33583，Y 值的范围为 21602 到 21655。

    利用这些信息，您可以设置一个受约束的图块网格，其中只应请求有效的图块：

    const tilegrid = ol.tilegrid.createXYZ({maxZoom: 16});
const extent = ol.extent.createEmpty();
ol.extent.extend(extent, tilegrid.getTileCoordExtent([16, 33504, 21602]))
ol.extent.extend(extent, tilegrid.getTileCoordExtent([16, 33583, 21655]))

const src =new ol.source.XYZ({
      url: 'https://s3.eu-central-1.amazonaws.com/old-maps/the-hague-1944/tiles/{z}/{x}/{y}.jpg',
      tileGrid: new ol.tilegrid.TileGrid({
        origins: tilegrid.getResolutions().map((r, i) => tilegrid.getOrigin(i)),
        resolutions: tilegrid.getResolutions(),
        tileSizes: tilegrid.getResolutions().map((r, i) => tilegrid.getTileSize(i)),
        minZoom: 10,
        extent: extent,
      })
});

    范围将以 EPSG:3857 坐标为单位，transformExtent如果需要，您可以用来转换为 LonLat。

    • 1

相关问题