如何在 Angular/Ionic App 中离线使用谷歌地图 API

Question

I have an Angular 12 Ionic app that is using the Google Maps API via @angular/google-maps package ( https://github.com/angular/components/tree/master/src/google-maps#readme ). 我们正在构建的应用程序将用于互联网访问最多可能参差不齐的区域。 当 Internet 丢失时，我们正在尝试维护 map 的功能。 IE，如果我们 go 离线，可能会在本地缓存或存储加载的 map 以供参考。

1. 当我们初始化 map 并加载任何折线和标记时，我们希望用户在线

2. 如果用户随后 go 离线并在应用程序中导航，当返回 map 时，我们希望显示之前加载的 map、折线和标记。

当前发生的情况是组件被销毁，然后在导航回时重新加载，导致重新加载 map，因为我们处于离线状态，所以无法发生这种情况。 但是，如果我们能够缓存或本地存储 map，那么我们可以从缓存/本地加载它，直到用户重新联机。

使用上面描述的 package 我们正在考虑尝试将 google.maps object 序列化为 json 进行存储，但这会导致问题。

let mapTest: google.maps.Map;
const center: google.maps.LatLngLiteral = { lat: centerPoint.lat, lng: centerPoint.lng };

mapTest = new google.maps.Map(document.getElementById('map') as HTMLElement, {
   center,
   zoom: 11
});

这是由 Google API 文档（ https://developers.google.com/maps/documentation/javascript/using-typescript ）提供的基本 typescript 实现。 当我们尝试对 map 进行字符串化时，我们收到以下错误

如果我们对 mapTest.data 进行字符串化，则会显示相同的错误。

问题是，我们可以做些什么来在本地存储 google.map object 或 google.map.data ZA8ZCFDE6331BD4B86626 这最终将被放置到使用 Ionic 的 Android 设备上，使用原生 Android 地图是否可以做到这一点？ 或者这根本不是一个可行的任务

Answer 1

谷歌地图 JavaScript API 不能离线使用。

请参阅功能请求： API 功能以下载 map 以供离线使用。