如何在React Native中离线使用谷歌地图

Question

我想在我的React Native应用中启用用户离线使用地图，我正在使用react-native-maps。

我想仅为预定义区域（比如一座城市）提供离线模式，因此我需要下载所有所需的瓦片，这将是大量的图像，所以我想知道是否有一种方法在Google地图API中下载地图区域（就像在Google地图应用程序中一样）？
根据文档，可以启用缓存，我也按照文档做了同样的事情，但在我的情况下，我不想缓存用户访问的每个地方，正如我所说，我只想缓存/下载预定义区域。
编辑1
react-native-maps支持离线导航，为此，我需要使用以下代码：

 <LocalTile pathTemplate={this.state.pathTemplate} tileSize={256}/>

使用路径模板指向我的瓦片位置，该位置必须具有以下层次结构：

location/{z}/{x}/{y}

因此，我的真正问题是如何获取我的区域的瓷砖。
我可以通过从谷歌地图瓦片服务器手动保存瓦片来完成，但我不知道是否合法，也需要花费大量时间和计算（当缩放时，我需要计算下一个瓦片的坐标）。
因此，如果Google地图API提供一种下载特定区域瓦片（需要缩放）的方法，那么就很好了。
另一种选择是使用其他地图提供程序，如OpenStreetMap，但在这里，我也需要找到一种一次性下载所有瓦片的方法。

- aName

Answer 1

目前唯一支持离线地图的 react-native 模块是 react-native-mapbox-gl.

<MapView>
<LocalTile
pathTemplate="../pathToLocalStoredTile.png"
tileSize={126}
/>
</MapView>

我可以为你提供帮助。

由于Google Maps SDK没有实现这个功能，唯一的离线选择是使用自定义瓦片。

- Rishav Kumar

---

谢谢您的回复，但是react-native-maps也支持离线地图。问题在于我需要下载瓦片（png图像），而对于一个城市，我想我需要超过200张图片，因此，我想知道是否有一种方法可以一次性获取它们。 - aName

我现在看到这个问题了。我会为这个问题提供更好的答案！ - Rishav Kumar

Answer 2

如果您想要下载地图，可以使用React-native MapBox的SnapShotManager。

请参考SnapShotManager文档：https://github.com/react-native-mapbox-gl/maps/blob/master/docs/snapshotManager.md。

// creates a temp file png of base map
const uri = await MapboxGL.snapshotManager.takeSnap({
  centerCoordinate: [-74.126410, 40.797968],
  width: width,
  height: height,
  zoomLevel: 12,
  pitch: 30,
  heading: 20,
  styleURL: MapboxGL.StyleURL.Dark,
  writeToDisk: true, // Create a temporary file
});

// creates base64 png of base map without logo
const uri = await MapboxGL.snapshotManager.takeSnap({
  centerCoordinate: [-74.126410, 40.797968],
  width: width,
  height: height,
  zoomLevel: 12,
  pitch: 30,
  heading: 20,
  styleURL: MapboxGL.StyleURL.Dark,
  withLogo: false, // Disable Mapbox logo (Android only)
});

// creates snapshot with bounds
const uri = await MapboxGL.snapshotManager.takeSnap({
  bounds: [[-74.126410, 40.797968], [-74.143727, 40.772177]],
  width: width,
  height: height,
  styleURL: MapboxGL.StyleURL.Dark,
});

- sugaith