有没有办法在离子上的混合移动应用程序上保存离线谷歌地图？

Question

我计划使用离子开发混合移动应用程序.我需要的功能之一是离线谷歌地图.有办法怎么做？

Answer 1

这取决于您的应用程序的要求是否可行.您的用户是"现代"设备AKA是否完全支持HTML5？您的用户是否需要全局或仅在特定区域中查看/编辑地图？地图真的需要由谷歌提供吗？我将解决下面的一些问题,以指出您可能解决此问题.

你真的需要谷歌地图吗？(最佳场景)
首先,你真的需要谷歌地图吗？同样相关:您的用户需要缩放他们的地图多远？如果它可以是任何地图,并且缩放实际上不是高优先级(如果是,包括所有地图图块将使应用程序占用所有存储空间),您可以使用地图图块作为应用程序的打包部分,并显示他们有像http://leafletjs.com/这样的图书馆.该库已有详细记录,并为各种地图提供者提供了地图界面.可以将其配置为使用您自己的本地地图图块.如有必要,您可以包含多个缩放级别的地图图块,并将最小/最大缩放级别限制为实际可用的图块.这将使您的地图脱机工作.

我不能或不愿意提供我自己的瓷砖 确保你真的看了选项,那里有系统提供你可以使用的地图瓷砖(检查https://www.mapbox.com /例如)
好的,所以你真的不想做我的建议.现在有哪些选择？Javascript映射解决方案通常根据您要查看的地图位置和缩放级别来渲染切片.向tile-provider请求这些tile.我不知道如何为谷歌准确实现这一点,你可能需要对此进行一些研究 - 我会尽力帮你看一个方向.将要求从服务器获取切片.我在http://maps.google.com上查看了在尝试导航地图时加载了哪些图片:( 示例(点击)).找出你的情况下使用的url,稍后我们将需要这些url(只需检查浏览器控制台中的网络选项卡,看看在地图中滚动时发出了哪些请求).当我们只需要我们的用户在离线时在某个区域工作时,我们可以使用服务工作者在我们在线时缓存这些请求的响应,并在我们离线时为这些缓存提供服务.了解更多关于服务人员在这里(点击).
优势:您之前访问过的任何磁贴的实际离线地图功能(只要您的缓存没有溢出,具体取决于您的服务工作者的实现,以及服务工作者支持的浏览器/设备).
缺点:不支持从未放入缓存的磁贴(AKA:从未见过).另一个:这只适用于支持服务工作者的设备.在您不关心使用"旧"设备的用户,或者您可以控制用户设备选择的情况下,可能是一种选择.请注意,使用crosswalk可以简化您在此处的开发工作,因为您只需要考虑一个浏览器运行时:但是crosswalk也不支持旧设备.
但是:对于需要在特定区域工作的人来说,此解决方案可能没问题,对于@ vipul-r提供的情况可能也是如此.如果您或您的用户事先知道他们需要他们的地图工作的地方,您可以指导/帮助他们正确加载和缓存他们的地图.

如果您无法处理这两种解决方案中的任何一种,那么我非常怀疑会有一种方法可以做到这一点.据我所知,我没有看到任何其他方式.