我拿到这个任务的时候是懵逼的,因为没有做过地图,一波三折才会做。我是参考很多博客结合起来做的,主要是看这篇博客: https://blog.csdn.net/wml00000/article/details/82219015

一、下载百度在线API

我要用百度API里面的方法和参数,引入在线API文件时的地址,那么第一件事情就是下载百度API,访问这个地址 http://api.map.baidu.com/api?v=3.0 ,打开之后看到是一段代码,

在代码中找到 src = “http://api.map.baidu.com/getscript?v=3.0&ak=&services=&t=20180914170655” ,再次用浏览器打开这个地址,

这个是压缩后的js文件代码,利用谷歌浏览器自带的pretty print,

点击下面的大括号

把它先格式化一下,以便下面查看与修改,

再来就是复制粘贴保存到本地,保存到本地js文件里面,就先保存在bmap_offline_api_v3.0_min.js文件里咯。

二、修改本地API

1.第一件事就是屏蔽ak验证,根据 “&callback=BMap._rd._cbk” + c搜索bmap_offline_api_v3.0_min.js文件

定位到上面代码,将这句话
”if (/^http/.test(a)) return;//修改 屏蔽ak验证,若调用外部资源直接返回“加上

三、引用本地工具资源模块

百度地图提供的各种图层类,标记类,控件类等等都可以看作是modules,当你在地图中用到这些模块时,它会自动加载,因此我们需要先把这些模块的js文件下载下来,保存到本地。定位到下面代码,没数错的话,一共是41个模块。
我直接参考他人的博客创建一个modules文件夹,放入到modules文件夹当中,js代码可以这么获取: http://api0.map.bdimg.com/getmodules?v=3.0&mod=map_kqxukj
保存js文件时文件名也是这样如map_kqxukj.js,模块命名格式是map_kqxukj,直接拼接起来

1.为了便于修改主文件里的一些内容,先创建一个map_load.js文件,加入下面代码:

2.在bmap_offline_api_v3.0_min.js文件中定位到

D.ka=D.url.proto+("2"==D.wt?D.url.domain.main_domain_cdn.other[0]:D.url.domain.main_domain_cdn.baidu[0])+"/";

将其所在行注释掉,加上这行
D.ka = bmapcfg.home; //修改,本地工具资源引用(离线路径),如图:

3.通过 &mod 进行定位,注释掉其所在行,做如下修改:

这时候就可以创建modules文件夹,添加所需模块的js文件,注意命名格式,保存js文件时文件名也是这样如map_kqxukj.js

四、加载本地离线瓦片

定位到如下代码,做相应修改:

五、根据 http://lbsyun.baidu.com/jsdemo.htm#a1_2 百度地图示例和百度类参数 http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html#a3b7 做Demo测试

我已经把代码上传到我的资源里
https://download.csdn.net/download/qq_32407233/10763290

我的百度离线地图API V3.0制作相关推荐

  1. 百度离线地图API2.0 百度离线地图api,已经修改源码

    百度离线地图API2.0 百度离线地图api,已经修改源码,绕过服务端验证,除了路书等需要服务端数据支持的功能外,其余功能已经全部实现,包括常用的:地图示例.地图控件添加.覆盖物添加.信息窗口展示等等 ...

  2. 百度地图 Api v3.0 自定义信息窗体样式

    一.效果图 二.代码 注意要先引入: <script src="http://api.map.baidu.com/api?v=3.0&ak=IN43cyju8PVLGfSNwl ...

  3. vue整合百度离线地图api3.0

    文章目录 前言 一.场景 二.操作步骤 1.引入3.0js文件 2.创建map_load.js 3.修改bmap_offline_api_v3.0_min.js文件 3.1屏蔽ak验证 3.2加载mo ...

  4. 百度离线地图JSAPIV3.0

    原文地址::百度离线地图JSAPIV3.0 - 百度文库 相关文章 1.百度离线地图API V2.1 内含示例Demo,亲测可用----百度离线地图API V2.1 内含示例Demo,亲测可用 - 开 ...

  5. Qt之加载百度离线地图(WebKit和WebEngine)

    最近翻看进年前写了一篇关于百度离线地图的博客:Qt加载百度离线地图,发现存在很多问题,比如不能加载折线等图形覆盖物:只支持QtWebKit,不支持QtWebEngine. 之前做项目需要在百度离线地图 ...

  6. 百度离线地图开发,node实现地图瓦片下载

    最近有个Web项目要用离线地图,项目是在内网环境,找了很多资料,踩了很多坑,好在已经实现了,下面把资料整理一下. 首先是百度离线地图开发包,原文地址是http://www.xiaoguo123.com ...

  7. Android 百度地图 SDK v3.0.0 (四) 引入离线地图功能

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/37758097 一直觉得地图应用支持离线地图很重要啊,我等移动2G屌丝,流量不易, ...

  8. Vue-cli3实现web百度离线地图(v3.0)开发

    需求 实现基于Vue-cli3的web百度离线地图(v3.0)开发 Vue-cli3,目录如下,注意:需要把地图相关的文件放在public下,vue-cli2需要放在static下!!! 参考 主要参 ...

  9. 如何用百度离线API调用百度离线地图

    这里以广西南宁市为例,说明如何用百度离线API调用百度离线地图. 首先,点击视图左上方的地图类型按钮选择百度地图(如果没有该项请点击"更多"选项),然后在视图右上方选择广西省南宁市 ...

最新文章

  1. dsp和通用计算机的区别,dsp芯片是什么_dsp芯片和通用微处理器有什么区别
  2. The Future of Silverlight --December 2, 2010 at 9:00
  3. 分分钟教会你使用HTML写Web页面
  4. struts2-20-下载文件及授权控制
  5. nodejs mysql 模型_nodejs+mysql中怎样的model才是好的model?
  6. python until语句_详解Lua中repeat...until循环语句的使用方法
  7. CSP-S 2021 退役记
  8. 小弟带你走进VUE中input最大值设置出现的问题以及黑科技解决方案
  9. 登录界面转换实现html,html5和css3登录注册表单界面切换动画
  10. FFMPEG基于内存的转码实例——输入输出视频均在内存
  11. HTML5前端开发就业前景,高薪背后的原因分析!
  12. python - - 函数 - - 递归函数
  13. 【Landsat 8】介绍
  14. Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile 解决办法
  15. 电脑虎牙,虎牙助手主播版电脑版
  16. iOS 9 Safari广告拦截插件
  17. 国内首台商用人形双足机器人发展史
  18. 【thinkphp5操作redis系列教程】集合类型之sCard,sSize
  19. 生产制造业ERP管理系统财务管理解决方案
  20. 群友转发了一段家庭矛盾的视频

热门文章

  1. 视频播放html5网页video.js例子 源码下载
  2. 计算机科学世界第13,计算机专业世界排名:麻省理工第1名,清华第13名,北大第19名!...
  3. 算法:最优二叉搜索树
  4. gprMax电磁波正演模拟方法
  5. 减肥人士福利,用python的gevent模块queue方法爬取食物热量表并保存为excel文件
  6. 状态机 java_java版的状态机实现
  7. Z3 Solver中Tactic的使用
  8. details about rtp and rtcp
  9. Xcode imageNamed找图片插件
  10. IDEA如何快速获取图片相对路径