无论是百度还是高德地图开发,还是高德地图开发。官方的给的案例启示很多,copy再修改下,就完成了

https://lbs.amap.com/api/javascript-api/summary  http://lbsyun.baidu.com/index.php?title=jspopular3.0

这个大致看一下,我想。有点GIS基础都能完成地图开发。

个人认为百度的文档更友好些,起码排版让人感觉舒服很多。

高德地图 主要在参考手册里面找各类服务,然后应用到实际项目

在react和vue中,我们通过动态插入script 元素,onload 加载代码。

/**
 * 异步加载JS
 * @param scriptSrc {string} js url地址
 * @return {Promise}
 */
export default function loadMapScript (scriptSrc) {
  return new Promise((resolve) => {
    let mapScript = document.createElement('script')
    mapScript.src = scriptSrc
    document.body.appendChild(mapScript)
    mapScript.onload = resolve
  })
}

别人写好的参考,git上面有这个:https://github.com/iDerekLi/amap-js

行政区域查询:https://lbs.amap.com/api/javascript-api/guide/services/district-search 获取的是普通JSON数据

行政区域浏览:https://lbs.amap.com/api/javascript-api/reference-amap-ui/geo/district-explorer 能够获取的GeoJSON 数据

高德提供了全国区域

省市区json数据查询 https://webapi.amap.com/ui/1.0/ui/geo/DistrictExplorer/assets/d_v1/country_tree.json

省市查询 https://webapi.amap.com/ui/1.0/ui/geo/DistrictExplorer/assets/d_v1/area_tree.json

在功能上,个人觉得百度地图根强。特别是mapV。而且百度地图文档方面也跟美观。

手动绘制区域 生成 GeoJSON 数据的 工具:http://geojson.io/#map=10/26.8719/112.4437

自己动手做的话,推荐阅读《百度高德地图行政区域边界GeoJSON数据获取并绘制行政区域

转载本站文章《百度高德地图JS-API学习手记:地图基本设置与省市区数据加载》,
请注明出处:https://www.zhoulujun.cn/html/GIS/WebGIS/2710.html

百度高德地图JS-API学习手记:地图基本设置与省市区数据加载的更多相关文章

  1. 高德地图 JS API - 根据地名实现标记定位

    德地图 JS API 使用前的准备工作请参考官方网站说明: https://lbs.amap.com/api/javascript-api/guide/abc/prepare 根据地名实现地图标记定位 ...

  2. 高德地图 js api 使用

    使用高德地图js api 制作网页上的地图应用. 1.先申请一个 开发者用的 key . 2. 在页面中引入高德提供的地图js  <script src="http://webapi. ...

  3. 腾讯地图JS API实现带方向箭头的线路Polyline

    最近产品提出一个需求,在我们使用的腾讯地图上为线路polyline添加线路方向.例如下图所示: 查找腾讯地图JS API提供的API,没有找到对应的支持,询问负责腾讯地图的人也得到了同样的答案,即地图 ...

  4. Bing必应地图中国API一显示地图 (转) 做人要厚道

    Bing必应地图中国API一显示地图 2011-05-24 14:27:31|  分类: Bing&Google|字号 订阅     微软必应地图中国地图API发布已经有10天了,考虑到网上现 ...

  5. Ext JS 6学习文档-第4章-数据包

    Ext JS 6学习文档-第4章-数据包 数据包 本章探索 Ext JS 中处理数据可用的工具以及服务器和客户端之间的通信.在本章结束时将写一个调用 RESTful 服务的例子.下面是本章的内容: 模 ...

  6. selenium学习笔记11——driver.get(url) 页面加载时间太长

    在执行自动化测试用例过程中,发现因为网络慢或其他原因导致driver.get(url) 时,页面一直在加载,页面没有加载完成就不会去继续执行下面的动作,但是实际上需要操作的元素已经加载出来了. 解决方 ...

  7. 驱动开发学习笔记. 0.07 Uboot链接地址 加载地址 和 链接脚本地址

    驱动开发学习笔记. 0.07 Uboot链接地址 加载地址 和 链接脚本地址 最近重新看了乾龙_Heron的<ARM 上电启动及 Uboot 代码分析>(下简称<代码分析>) ...

  8. js同步、异步、延时、无阻塞加载

    一.同步加载 平常默认用的都是同步加载.如:<script src="http://yourdomain.com/script.js"></script> ...

  9. Redis深入学习笔记(一)Redis启动数据加载流程

    这两年使用Redis从单节点到主备,从主备到一主多从,再到现在使用集群,碰到很多坑,所以决定深入学习下Redis工作原理并予以记录. 本系列主要记录了Redis工作原理的一些要点,当然配置搭建和使用这 ...

  10. 使用js主函数的原因是等文档加载完了才给里面的元素添加东西 如果不使用主函数则文档加载时候无法找到元素则不能成功给元素添加事件

    使用js主函数的原因是等文档加载完了才给里面的元素添加东西 如果不使用主函数则文档加载时候无法找到元素则不能成功给元素添加事件

随机推荐

  1. 鸿蒙极速入门(四)-通过登录Demo了解ArkTS

    ArkTS是HarmonyOS优选的主力应用开发语言.ArkTS围绕应用开发在TypeScript(简称TS)生态基础上做了进一步扩展,继承了TS的所有特性,是TS的超集. ArkTS在TS的基础上主 ...

  2. VLAN通信之单臂路由与三层交换

    VLAN之间通信 再次提及,vlan是虚拟局域网,用于分隔广播域,解决广播风暴.但是vlan之间无法直接通信.所有我们要用三层交换.单臂路由来实现vlan之间的通信. 单臂路由 使用场景:规划错误,只 ...

  3. P9580 「Cfz Round 1」Wqs Game 题解

    题目链接 挺好的博弈论题,这是一个跟官方题解不太一样的做法. 遇到这种组合游戏可以先考虑逆推胜负,把握一下规律,我们先从一个区间的胜负判断开始入手. 考察区间中最后一个数字的从属关系,如果它属于弈,因 ...

  4. Redmi AC2100 路由器 官方固件允许IPv6外网访问下游设备

    升级/降级 至 官方固件版本: 2.0.23 稳定版.操作入口在路由器常用设置-系统状态-升级检测处. 开启SSH权限.F12打开浏览器的开发者模式,并切换至终端选项卡,复制以下代码至终端处,并敲回车 ...

  5. Excel表格存在不同大小的合并单元格怎么排序?

    当Excel表格中存在不同大小的合并单元格时,进行排序可能会出现一些难题.因为合并单元格会影响数据的布局,导致排序结果不符合预期. 下面我将详细介绍如何在包含不同大小合并单元格的Excel表格中进行排 ...

  6. 数据驱动决策,Datainside引领可视化报告新时代

    数据驱动决策已经成为当今社会中的重要趋势,而Datainside作为一家数据可视化报告平台,正引领着可视化报告的新时代.下面是关于Datainside平台的详细描述. 数据集成与连接 Datainsi ...

  7. [CF1364E] X-OR

    X-OR 题面翻译 题目描述 本题是交互题. 有一个固定的长度为 \(n\) 的排列 \(P\),其值域为 \([0,n-1]\),你可以进行不超过 \(4269\) 次询问,之后你需要输出这个排列 ...

  8. MybatisPlus入门到进阶

    1.创建一个SpringBoot项目 2.导入相关依赖 <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xs ...

  9. Roaring bitmaps

    Roaring bitmaps 最近看一篇文章,里面涉及到使用roaring bitmaps来推送用户广告并通过计算交集来降低用户广告推送次数.本文给出roaring bitmaps的原理和基本用法, ...

  10. 数字孪生技术与VR技术的结合会为我们带来什么?

    数字孪生技术与虚拟现实(VR)技术的结合为我们打开了全新的可能性和机遇.这个强大的联合为各个领域带来了巨大的影响和创新. 首先,数字孪生技术与VR技术的结合可以为设计和规划过程提供更直观.身临其境的体 ...