• 制作百度地图离线JavaScript API加载本地瓦片地图


    1.首先获取百度 JavaScript API

    首先用浏览器打开 http://api.map.baidu.com/api?v=1.3 如下图所示

    其中 http://api.map.baidu.com/getscript?v=1.3&key=&services=&t=20121108061854 这个链接就是我们要找的API文件,

    同样在浏览器中打开它,并另存为诸如“apiv1.3.min.js”

    还有百度地图必须的一些控件,光标,logo之类的图片也下载下来

    2.修改“apiv1.3.min.js”把里面的地图控件的图片,光标,logo等链接替换成本地的。

    3.下载百度地图瓦片,这个有很多方法可以获取。比如这个工具:MaptileDownloader

    4.开始使用离线地图api加载本地的地图切片

    现在,完全可以脱离网络使用百度地图了。示例源码如下:

    复制代码
     1 <!DOCTYPE html>
     2 <html>
     3     
     4     <head>
     5         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     6         <title>百度离线地图演示</title>
     7         <script type="text/javascript" src="js/apiv1.3.min.js"></script>
     8         <script type="text/javascript" src="js/map,oppc,navictrl,tile,copyrightctrl"></script>
     9         <!--script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script-->
    10         <link rel="stylesheet" type="text/css" href="bmap.css" />
    11     </head>
    12     
    13     <body>
    14         <div style="left:0;top:0;100%;height:100%;position:absolute;" id="container"></div>
    15     </body>
    16 
    17 </html>
    18 <script type="text/javascript">
    19     var tileLayer = new BMap.TileLayer({
    20         isTransparentPng: true
    21     });
    22     tileLayer.getTilesUrl = function (tileCoord, zoom) {
    23         var x = tileCoord.x;
    24         var y = tileCoord.y;
    25         return 'maptile/' + zoom + '/' + x + '/' + y + '.png';
    26     }
    27     
    28     var map = new BMap.Map('container');
    29     map.addTileLayer(tileLayer);
    30     map.addControl(new BMap.NavigationControl());
    31     map.centerAndZoom(new BMap.Point(100.675, 39.007978), 5);
    32     map.enableScrollWheelZoom();  //启用滚轮放大缩小
    33     map.enableKeyboard();       //启用键盘操作,默认禁用。键盘的上、下、左、右键可连续移动地图。
    34     map.enableContinuousZoom();//启用连续缩放效果
    35 
    36     var copyCtrl = new BMap.CopyrightControl({
    37         anchor: BMAP_ANCHOR_BOTTOM_RIGHT
    38     });
    39     copyCtrl.addCopyright({
    40         id: 1,
    41         content: "http://maptiledownloader.googlecode.com 百度离线地图演示"
    42     });
    43     map.addControl(copyCtrl);
    44 </script>
    复制代码


    作者: i-gps
    出处: http://www.cnblogs.com/i-gps/
    欢迎探讨交流Google Maps相关技术,QQ:64445322 QQ群:242284018
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

     
  • 相关阅读:
    协变与逆变
    反射
    TreeCombo
    使用TreeCombo示例
    Calling R from java using JRI
    [转]相似度计算常用方法综述
    [转]聚类算法KMeans, KMedoids, GMM, Spectral clustering,Ncut
    Learning D3.js with App iLearning D3.js
    [repost ]经典的机器学习方面源代码库
    [转]数据挖掘中所需的概率论与数理统计知识、上
  • 原文地址:https://www.cnblogs.com/guohu/p/15433361.html
Copyright © 2020-2023  润新知