当前位置: 首页 > news >正文

天地图入门|标注|移动飞行|缩放,商用地图替换

“天地图”是国家测绘地理信息局建设的地理信息综合服务网站。集成了来自国家、省、市(县)各级测绘地理信息部门,以及相关政府部门、企事业单位 、社会团体、公众的地理信息公共服务资源,如果做的项目是政府部门、企事业单位尽量选择天地图,因为相比其他几家服务商更加权威。

第一步:登录/注册 国家地理信息公共服务平台
第二步:点击我 点击控制台 会提示注册为开发者

第三步:注册开发者后    创建新应用 选择浏览器端(可以不填白名单) 里面有  您的密钥

第四步:复制 下面的html

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8" /><title>HELLO WORLD</title><script type="text/javascript" src="http://api.tianditu.gov.cn/api?v=4.0&tk=您的密钥"></script><script>var map;var zoom = 5;//默认级别(19级:20米18级:50米 17级:100米,15级:500米,14级:1公里,13级:2公里, 12级:5公里,11级:10公里,10级:20公里,5级 中国)function onLoad() {//找到DIV初始化//参数 projection: 'EPSG:4326' 倾斜 900913map = new T.Map('mapDiv', {projection: 'EPSG:3785'})// 中心点和初始化级别map.centerAndZoom(new T.LngLat(116.40769, 39.89945), zoom);//改变底色//map.setStyle('indigo')//创建一个点var lng1 = new T.LngLat(116.411794, 39.9068);// 创建标注对象var marker = new T.Marker(lng1);// 点击标注点marker.addEventListener("click", (e) => {console.log(e)})// 创建文本对象var label = new T.Label({text: "用户1",position: lng1,offset: new T.Point(-9, 0)});//向地图上添加标注map.addOverLay(marker);//向地图上添加文本map.addOverLay(label);//2秒后级别为19 且移动到 创建的点setTimeout(function () {map.setZoom(19);map.panTo(lng1);}, 2000);}</script>
</head>
<body onLoad="onLoad()"><div id="mapDiv" style="position:absolute;width:1500px; height:900px"></div>开发文档  http://lbs.tianditu.gov.cn/api/js4.0/examples.html
</body>
</html>

到此 初始化,创建标注点,标注点加文字,放大地图,移动到标注点  都已实现

http://www.lryc.cn/news/479836.html

相关文章:

  • Flutter PC端UI组件库
  • NVR小程序接入平台/设备EasyNVR多品牌NVR管理工具/设备汇聚公共资源场景方案全析
  • 干部谈话考察系统:革新传统,精准高效
  • 反转链表(Leetcode)
  • 制作游戏外挂的技术栈有哪些
  • python下载pdf
  • 我们来学mysql -- 同时使用 AND 和 OR 查询错误(填坑篇)
  • 关于Websocket
  • vue2 pdf 链接地址打开
  • c# 动态lambda实现二级过滤(多种参数类型)
  • 34.Redis事务
  • 认识类和对象
  • 解决echarts桑基图为0时tooltip不显示的问题
  • vue3 基础笔记
  • Oracle 第30章:最佳实践与案例研究
  • 第九周预习报告
  • 【分享】这篇教程助力你成为 JavaScript 糕手!(四)
  • 双亲委派模型的破坏
  • Android关机流程知多少?
  • 深入理解指针end(总结篇)
  • C# 程序暂停的两种方式
  • 【LeetCode】【算法】160.相交链表
  • 光伏破局 引领能源革命
  • Jenkins声明式Pipeline流水线语法示例
  • 互联网技术净土?原生鸿蒙开启全新技术征程
  • 关于Django 模型字段 `choices`自定义数据类型的枚举——补充
  • CAP理论的延申--BASE理论
  • 【傻呱呱】phpMyAdmin怎样给特定用户授权特定数据库权限?
  • 『VUE』21. 组件注册(详细图文注释)
  • 如何产看SQL 查询的执行时间