react-native - Maptiler 在 reactnative-native-map 中提供的栅格图块是一团糟？

Question

<UrlTile
urlTemplate={'https://api.maptiler.com/maps/topographique/256/{z}/{x}/{y}@2x.png?key=nQEdJcXZH5PRPm3AKJtX'}/>

这就是我<MapView>从react-native-maps模块中设置 urlTile 的方式。

不管我等多久，加载的地图都是一团糟。有人知道发生了什么吗？

这在 ios 模拟器和 ios 设备中都可以重现，只需执行以下步骤，使用 expo：

1. expo init一个空白项目
2. yarn add react-native-maps
3. 将以下代码放在顶层视图中，使用基本样式使其全屏显示。
4. 你去吧。

  <MapView style={styles.mapStyle}>
    <UrlTile
      urlTemplate={'https://api.maptiler.com/maps/topographique/256/{z}/{x}/{y}@2x.png?key=nQEdJcXZH5PRPm3AKJtX'}
    />
  </MapView>

Answer 1

使用高分辨率（512 像素）图块时，我遇到了类似的问题。虽然看起来您正在从 URL 访问 256 像素的图块，但您也访问了 @2x 分辨率，通常为 512 像素。也许仔细检查你的分辨率是否正确。

  <UrlTile
      urlTemplate={this.urlTemplate}
      tileSize={512}
  />