需求

通过一个按钮，打开地图拿到这个显示的位置的经纬度，在地图上找到这个位置

给按钮绑定事件

这个事件需要打开对话框，并且拿到经纬度

<el-button type="primary" size="mini" plain @click="mapClick(projectData.lonLat)">查看位置</el-button>

实现这个方法

mapClick(lonLat){let num1 = new Array()num1 = lonLat.split(',')this.mapDialogVisible = true//打印出来的黑色数字是字符串，蓝色的才是数字const longitude = Number(num1[0])//经度const latitude = Number(num1[1])//纬度// 定义点标记对象this.$nextTick(() => {this.initMap(longitude,latitude)})}

这里进行解释一下：lonLat就是那个传过来的经纬度，在这里需要将他拆分字符串，用到了split这个方法，是js里的； this.mapDialogVisible = true这个就是打开对话框，再将拆分的字符串转化成数字赋值给longitude和latitude，那个this.initMap就是实例化这个地图

实例化地图组件

如果不实例化地图的话，是展示不出地图的，
在上面写那个方法的时候我们将经纬度传过来了，所以在这里直接lng,lat进行接收，记得在return中初始化这个地图

使这个初始化地图的中心点设置为传过来的经纬度，这样就可以随着你经纬度的不同，展示的地图的位置也会随之改变，下面那个projectMapMarker就是一个标点的marker，官网里是有说明的，高德地图点标记官网

initMap(lng,lat) {this.mapLocal = new AMap.Map("container", {resizeEnable: true,//禁止拖动地图// dragEnable: false,//禁止放大地图// zoomEnable:false,center: [lng,lat],zoom: 16,//地图显示的缩放级别})const projectMapMarker =  new AMap.Marker({position: [lng, lat],icon: 'https://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',})// 添加点标记在地图上projectMapMarker.setMap(this.mapLocal)},

最后是通过官网的一个setMap方法将我们建立的点，标记在地图上，这样就做好了这样的效果。

已知经纬度自动在地图上标点相关推荐

ArcGIS已知经纬度范围裁剪图像的步骤
ARCGIS已知经纬度范围裁剪图像的步骤: (1)生成经纬度的面 (2)利用裁剪工具裁剪:分析工具-->提取分析-->裁剪其中第一步: (1)生成四个顶点的坐标点用xls保存(注意不能用 ...
已知经纬度坐标求两点间距离，用python表示
已知经纬度坐标求两点间距离,用python表示已知地球上任意两点(lon1, lat1),( lon2, lat2)的经纬度坐标,求两点间的距离用haversine表示: 1.首先先将经纬度坐标的角 ...
python坐标表示_已知经纬度坐标求两点间距离，用python表示
已知经纬度坐标求两点间距离,用python表示已知地球上任意两点(lon1, lat1),( lon2, lat2)的经纬度坐标,求两点间的距离用haversine表示: 1.首先先将经纬度坐标的角 ...
python地图标注_Python 给定的经纬度标注在地图上的实现方法
博主最近发现了python中一个好玩的包叫basemap,使用这个包可以绘制地图.值得说一下的是,basemap还没有pip检索,因此不能直接使用pip install basemap,来安装这个包. ...
（百度地图）输入地址显示经纬度并且在地图上显示具体位置
输入地址显示经纬度并且在地图上显示具体位置博主比较懒,不过多描述,直接上代码,通俗易懂,哈哈哈哈哈哈引入百度地图<script type="text/javascript" ...
python按经纬度在地图上标识_Python 给定的经纬度标注在地图上的实现方法
博主最近发现了python中一个好玩的包叫basemap,使用这个包可以绘制地图.值得说一下的是,basemap还没有pip检索,因此不能直接使用pip install basemap,来安装这个包. ...
python通过经纬度点制图_Python 给定的经纬度标注在地图上的实现方法
博主最近发现了python中一个好玩的包叫basemap,使用这个包可以绘制地图.值得说一下的是,basemap还没有pip检索,因此不能直接使用pip install basemap,来安装这个包. ...
Python 给定的经纬度标注在地图上的实现方法
今天小编就为大家分享一篇Python 给定的经纬度标注在地图上的实现方法,具有很好的参考价值,希望对大家有所帮助.一起跟随小编过来看看吧博主最近发现了python中一个好玩的包叫basemap,使用 ...
高德地图JS - 已知经纬度来获取街道、城市、详细地址等信息
1.时候偶现你得引入谷歌API|JS var geoCoder = new AMap.Geocoder({city: ""//城市,默认:"全国" }); va ...
android百度地图轨迹实现,android 获取GPS经纬度在百度地图上绘制轨迹
实现将一组GPS模块获取的经纬度数据在百度地图上绘制轨迹 1.将经纬度转换成百度地图坐标 /** * 标准的GPS经纬度坐标直接在地图上绘制会有偏移,这是测绘局和地图商设置的加密,要转换成百度地图坐标 ...

已知经纬度自动在地图上标点

步骤

需求

给按钮绑定事件

实现这个方法

实例化地图组件

已知经纬度自动在地图上标点相关推荐

最新文章

热门文章