我计划使用离子开发混合移动应用程序。我需要的功能之一是离线谷歌地图。有办法怎么做?
答案 0 :(得分:7)
这取决于您的应用程序的要求是否可行。您的用户是"现代"设备A.K.A是否完全支持HTML5?您的用户是否需要全局或仅在特定区域中查看/编辑地图?地图真的需要由谷歌提供吗?我将在下面解决一些问题,以指出您可能解决此问题。
你真的需要谷歌地图吗?(最佳场景)
首先,你真的需要谷歌地图吗?同样相关:您的用户需要缩放他们的地图多远?如果它可以是任何地图,并且缩放不是真正的高优先级(如果是,包括所有地图图块将使应用程序占用所有存储空间),您可以使用地图图块作为打包应用程序的一部分,并使用http://leafletjs.com/等库显示它们。该库已有详细记录,并为各种地图提供者提供了地图界面。可以将其配置为使用您自己的本地地图图块。如有必要,您可以包含多个缩放级别的地图图块,并将最小/最大缩放级别限制为实际可用的图块。这将使您的地图脱机工作。
我不能或者不提供我自己的瓷砖 确保您真正考虑过这个选项,那里有系统提供您可以使用的地图图块(例如,选中https://www.mapbox.com/)
好的,所以你真的不想做我的建议。现在有哪些选择? Javascript映射解决方案通常根据您要查看的地图位置和缩放级别来渲染切片。向tile-provider请求这些tile。 我不知道如何为谷歌准确实现这一点,您可能需要对此进行一些研究 - 我会尝试帮助您查看方向。将要求从服务器获取切片。我用http://maps.google.com检查了在尝试导航地图时加载了哪些图像:(example (click))。找出在您的情况下使用的网址,稍后我们将需要这些网址(只需检查浏览器控制台中的网络标签,并查看在地图中滚动时发出的请求)。 当我们只需要我们的用户在离线时在某个区域工作时,我们可以使用服务工作者在我们联机时缓存这些请求的响应,并在我们离线时为这些缓存提供服务。详细了解服务人员here (click)
优势:之前访问过的任何磁贴的实际离线地图功能(只要您的缓存没有溢出,具体取决于您的服务工作者的实施情况,以及服务工作者支持的浏览器/设备)。
缺点:不支持从未放入缓存的磁贴(AKA:以前从未见过)。另一个:这只适用于支持服务工作者的设备。在您不关心使用"年龄较大的用户的情况下,可能会有一种选择。设备,或者您可以控制用户设备选择的地方。请注意,使用crosswalk可以简化您在此处的开发工作,因为您只需要考虑一个浏览器运行时:但是人行横道也不支持旧设备。
然而:此解决方案对于需要在特定区域工作的人来说可能没问题,对于@ vipul-r提供的情况可能是正确的如果您或您的用户提前知道他们需要的地方他们的地图工作,你可以指导/帮助他们加载和正确缓存他们的地图。
如果您无法处理这两种解决方案中的任何一种,那么我非常怀疑会有一种方法可以做到这一点。据我所知,我没有看到任何其他方式。