html 高德地图坐标,HDHCMS收集高德地图坐标拾取
#iMap {
height: 1200px;
width: 1000px;
float: left;
}
.info {
float: left;
margin: 0 0 0 10px;
}
label {
width: 80px;
float: left;
}
.detail {
padding: 10px;
border: 1px solid #aaccaa;
}
高德地图坐标拾取工具(GCJ-02坐标)
说明:
1、鼠标滚轮可以缩放地图,拖动地图。
2、点击地图,即可获得GCJ-02的经纬度坐标,即火星坐标。
HDHCMS收集高德地图坐标拾取
var mapObj;
var lnglatXY;
//初始化地图
function mapInit() {
var opt = {
level: 10, //设置地图缩放级别
center: new AMap.LngLat(114.064675,22.548782) //设置地图中心点
}
mapObj = new AMap.Map("iMap", opt);
AMap.event.addListener(mapObj, 'click', getLnglat); //点击事件
}
function geocoder() {
var MGeocoder;
//加载地理编码插件
mapObj.plugin(['AMap.ToolBar','AMap.Scale','AMap.OverView','AMap.MapType','AMap.Geolocation'],
function(){
mapObj.addControl(new AMap.ToolBar());
mapObj.addControl(new AMap.Scale());
mapObj.addControl(new AMap.OverView({isOpen:true}));
mapObj.addControl(new AMap.MapType());
mapObj.addControl(new AMap.Geolocation());
});
mapObj.plugin(["AMap.Geocoder"], function () {
MGeocoder = new AMap.Geocoder({
radius: 1000,
extensions: "all"
});
//返回地理编码结果
AMap.event.addListener(MGeocoder, "complete", geocoder_CallBack);
//逆地理编码
MGeocoder.getAddress(lnglatXY);
});
//加点
var marker = new AMap.Marker({
map: mapObj,
icon: new AMap.Icon({
image: "https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png" ,
size: new AMap.Size(58, 30),
imageOffset: new AMap.Pixel(-0, -0)
}),
position: lnglatXY,
offset: new AMap.Pixel(-5, -30)
});
// mapObj.setFitView();
}
//回调函数
function geocoder_CallBack(data) {
console.log("ddd");
var address;
//返回地址描述
address = data.regeocode.formattedAddress;
console.log(address);
//返回结果拼接输出
document.getElementById("iAddress").innerHTML = address;
}
//鼠标点击,获取经纬度坐标
function getLnglat(e) {
mapObj.clearMap();
var x = e.lnglat.getLng();
var y = e.lnglat.getLat();
document.getElementById("lnglat").innerHTML = x + "," + y;
lnglatXY = new AMap.LngLat(x, y);
geocoder();
}
html 高德地图坐标,HDHCMS收集高德地图坐标拾取相关推荐
- vue-aMap高德地图的应用(添加覆盖物点坐标、自定义图标、添加信息窗体信息等)
vue-aMap高德地图的应用(添加覆盖物点坐标.自定义图标.添加信息窗体信息等) 最近在项目开发中用到了aMap高德地图,简单记录一下,话不多说,直接上代码. 官方文档参考:高德地图aMap官方文档 ...
- android 高德坐标对象,android: 高德地图
分为地图,定位,搜索(我还没做导航功能) 建议采用gradle方式集成 添加依赖 在project/build.gradle文件下添加jcenter的仓库地址 allprojects { reposi ...
- 高德地图获取可视区域内四角坐标(东北,东南,西南,西北)
高德地图获取可视区域内四角坐标(东北,东南,西南,西北) 场景:当需要实现查询某坐标区域内的所有共享单车,那么常规操作就是把所选区域内的左上和右下两点经纬度给到后端.获取方法如下: // 初始化地图m ...
- gcoord: 转换WGS84、GCJ02、BD09坐标,解决百度地图高德地图坐标系不统一的问题
做过地图相关开发的同学肯定会遇到这样一个问题:同样的经纬度坐标,在百度地图和高德地图上位置不一样. 关于坐标系 我们通常用经纬度来表示一个地理位置,但是由于一些原因,我们从不同渠道得到的经纬度信息可能 ...
- 高德地图markevents_GitHub - mingxuWang/Map: 高德地图API二次封装
Map组件设计文档 组件设计目的 分析当前各业务方向(销售端.商城.数据可视化.TMS)内地图相关应用的地图功能使用情况,封装Map组件供给各业务向进行使用. 将高德地图API进行二次封装,降低地图相 ...
- iOS定位服务与地图应用开发:高德地图开发
2019独角兽企业重金招聘Python工程师标准>>> 由于博客迁移至www.coderyi.com,文章请看http://www.coderyi.com/archives/419 ...
- 【高德地图API】从零开始学高德JS API(一)地图展现——仙剑地图,麻点图,街景,室内图
摘要:关于地图的显示,我想大家最关心的就是麻点图,自定义底图的解决方案了吧.在过去,marker大于500之后,浏览器开始逐渐卡死,大家都开始寻找解决方案,比如聚合marker啊,比如麻点图啊.聚合m ...
- java高德地图api开发平台_【高德地图API】从零开始学高德JS API(一)地图展现...
摘要:关于地图的显示,我想大家最关心的就是麻点图,自定义底图的解决方案了吧.在过去,marker大于500之后,浏览器开始逐渐卡死,大家都开始寻找解决方案,比如聚合marker啊,比如麻点图啊.聚合m ...
- 高德地图api调用demo_高德地图定位如何调用api?
我看了下,貌似没有得到具体街道的位置,不过可以得到经纬度相关信息 AMap.Geolocation定位服务插件.基于HTML5的定位接口,只有支持该定位接口的浏览器才能使用该功能.它在浏览器原生定位接 ...
- ios html调起高德地图,iOS开发笔记 调起本地地图导航(百度、高德、腾讯、苹果自带)...
地图 从自己的APP跳转到用户本地的APP进行导航.首先,要先查看用户都安装了哪些地图类APP. 下面分3种情况进行分析: 1.用户没有安装第三方的地图,只有苹果自带的地图应用. 2.用户安装一款第三 ...
最新文章
- FLASH处理图像的移动、缩放、旋转、颜色变换的类推荐。
- python创建数据集_使用Python从图像创建数据集以进行人脸识别
- 解决R 4.0版本包的安装错误
- WPF学习笔记 - 不一样的皇帝的新衣
- html聚光灯特效,css实现聚光灯效果的代码分享
- 2015 UESTC 搜索专题B题 邱老师降临小行星 记忆化搜索
- java 换行分割_用Java开发自己的Kubernetes控制器,想试试吗?
- 【读书笔记】钢铁是怎么炼成的
- mfc配置GDI+有106个错误
- Facebook再遭黑客攻击 部分账户密码被盗
- 批量修改注册表之Bat脚本
- 【GD32F310开发板试用】gcc启动文件制作
- 回溯法求解TSP问题(旅行商问题)
- 工程项目管理——第七章 软件进度管理
- kthreaddk病毒查杀记录
- ONNXRUNTIME_EXCEPTION : Non-zero status code returned while running Where node. Name:‘Where‘
- linux运行igv报错,IGV 哐当就不能用了,除了换台电脑还能怎么办?
- 客户端登陆 T3标准版,已停止工作
- 纺织服装业如何利用技术进行数字化转型
- 电脑计算机 回收站隐藏文件,电脑在回收站删除的文件能恢复吗
热门文章
- 《最后的风之子/神风终极战士》1024*576分辨率 BD中英双字无水印
- Visio 2013打开自动关闭,闪退的解决办法
- python项目目录结构
- txt文件转为excel文件
- 黑盒测试--等价类划分
- 办公搜索利器UTOOLS-基于EVERYTHING的文件快速搜索软件
- 使用Eclipse,Kemulator模拟器配置J2ME工程
- python函数手册 chm_Python中文文档
- MATLAB_R2018b安装教程
- Depth Map Prediction from a Single Image using a Multi-Scale Deep Network