Google Maps API加载MBTiles离线地图

最新推荐文章于 2024-10-10 07:37:10 发布

MobileCSD

最新推荐文章于 2024-10-10 07:37:10 发布

阅读量5.1k

点赞数

分类专栏： Google离线地图文章标签： google maps MBTiles 地图

本文链接：https://blog.csdn.net/zhang1244j/article/details/40277013

版权

本文介绍了如何使用Google Maps API加载MBTiles格式的离线地图。作者在阅读一篇网文后，利用周末时间研究了Google Maps API，并发现可以通过Base64编码在页面中显示二进制瓦片数据。文章详细描述了将MBTiles中的二进制数据转化为可以在地图上显示的步骤，以及前端使用Leaflet库进行封装的过程。

摘要由CSDN通过智能技术生成

第一次写博客，好忐忑。。。

上周看了这篇网文http://www.cnblogs.com/i-gps/p/3919475.html，深受启发虽尚未实践但感觉颇有价值，只是苦于没有内中细节，遂利用周末时间重新查阅Google Maps API尝试一番。

文档中Google Maps图片地图类型加载本地的瓦片文件，创建地图类型的方法如下：

function GMapsMapTypeFactory() {}
GMapsMapTypeFactory.createMapType = function (name,mapTilePath) {
    var getTileUrl = function (coord, zoom) {
        var numTiles = (1 << zoom);if ((coord.y < 0) || (coord.y >= numTiles)) {
            return null;
        }
        var numx = (coord.x % numTiles + numTiles ) % numTiles;    /*水平方向重复，垂直方向重复方法类似*/


        if (name == "卫星")
            return mapTilePath + zoom + "/" &#