该功能只需要获取经纬度(别忘了npm百度插件)
首先需要一个js,这边我定义为map.js

在你需要的页面import

在created里加载

获取经纬度代码

map.js

export function loadBMap(funcName) {var script = document.createElement("script");script.src = "http://api.map.baidu.com/api?v=2.0&ak=你的秘钥&callback=" + funcName;document.body.appendChild(script);
}
import { loadBMap } from "./../../../static/js/map";
 created() {window.initBaiduMapScript = () => {// console.log(BMap);this.getlocation();};loadBMap("initBaiduMapScript");},
    // 获取经纬度getlocation() {const that = this;this.$nextTick(function() {try {const geolocation = new BMap.Geolocation();geolocation.getCurrentPosition(function(r) {// console.log(r);this.lat = r.latitude;this.lng = r.longitude;this.city = r.address.city;localStorage.setItem("lat", r.latitude);localStorage.setItem("lng", r.longitude);localStorage.setItem("city", r.address.city);if (this.getStatus() == BMAP_STATUS_SUCCESS) {const { lat = null, lng = null } = r.point;}});} catch (e) {console.log(e);}});}

vue获取地图经纬度相关推荐

  1. 根据坐标获取地图经纬度

    /// <summary>         /// 根据坐标获取地图经纬度         /// </summary>         /// <param name= ...

  2. Vue Cli4 使用高德地图定位 获取当前经纬度信息以及周边定位

    以上是最终效果图 下面开始代码分享 第一步 在index,html引入高德地图模块 ` <!-- 高德地图 --><script type="text/javascript ...

  3. vue 微信公众号获取定位经纬度 腾讯地图逆地址解析为具体地址

    最近做项目需要用到 微信公众号获取定位,并将定位转换为具体地址的需求,找了挺多,最后整理下,分享给大家~ 我这里使用的是腾讯地图,也可以使用其他的如百度.高德等. 思路是,先使用微信开放文档的获取定位 ...

  4. Vue项目使用百度地图——经纬度地图组件的封装及使用

    1 前言 要在vue项目使用百度地图api,首先应做以下配置 (1)index.html index.html添加script <script src="http://api.map. ...

  5. vue和java获取地理位置经纬度

    一.java根据地理位置获取经纬度. 百度地图 SDK开发密钥的申请地址为:https://lbs.baidu.com/apiconsole/key#/home public class EntCoo ...

  6. android百度地图轨迹实现,android 获取GPS经纬度在百度地图上绘制轨迹

    实现将一组GPS模块获取的经纬度数据在百度地图上绘制轨迹 1.将经纬度转换成百度地图坐标 /** * 标准的GPS经纬度坐标直接在地图上绘制会有偏移,这是测绘局和地图商设置的加密,要转换成百度地图坐标 ...

  7. 【百度地图API】自行获取区域经纬度的工具

    原文:[百度地图API]自行获取区域经纬度的工具 摘要:上一章教大家如何建立自己的行政区域地图.这次为大家提供一个,可视化选择区域,并且能自动生成经纬度代码的工具.工具的源代码完全公开,并且做了详尽的 ...

  8. python获取地图上经纬度_Python获取各大地图平台经纬度数据,哪家的数据最准确?...

    本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理 以下文章来源于菜J学Python ,作者J哥 前言 不知道大家会在什么场合使用地图 ...

  9. 百度地图开发:H5获取GPS-wg84经纬度与百度定位API的偏差测试

    HTML容器 <div id="map" style="width: 100%;height: 450px;"></div> <d ...

最新文章

  1. 刚接手的项目代码 怎么看_11.21号动态:音恋今天公告称团队刚接手这个项目没多久...
  2. IE6,IE7,FF等浏览器不兼容原因及解决办法(转)
  3. 小师妹学JVM之:逃逸分析和TLAB
  4. [Amaze UI] 如何推进 mobile first 的前端 Web 方案
  5. Spring事务管理示例JDBC
  6. u盘安装CENTOS后,启动missing operating system ,只能用U盘才能启动系统
  7. Android Service中的android:process=:remote
  8. 网页录音之麦克风权限问题
  9. bandicam安装及使用教学
  10. 怎么用python实现序列比对_生信学习笔记——Python+Mafft实现批量化多序列比对
  11. 毕业四年,我当初是如何走上编程这条路的!
  12. 在3小时内学习Kubernetes:编排容器的详细指南
  13. 百变怪之善口技者——mocking bird 完全指北
  14. Python机器学习04——惩罚回归
  15. 第三方应用微信登录接口
  16. 【百度地图api】之获取当前用户地理位置-浏览器定位
  17. Teigha的BlockTableRecord获取方法
  18. java Swing 背景音效的添加
  19. linux之vim下载及编写规则
  20. iOS安全-测试内容

热门文章

  1. (超详细的新手教程)怎么下载JDK包?
  2. selenium 模拟人工登录 高德开发者平台(python)
  3. 数据分析(1)——统计学中的各种分布
  4. word “域” 插入图片目录
  5. 建网站,买域名和虚拟空间总共要多少钱?
  6. 随心玩玩(三)Mirai框架QQ机器人
  7. Siemens CXV65+Photoshop CS2
  8. 国家网络安全宣传周开幕 志翔科技护航核心数据与业务安全
  9. 讨论-职场中年人,你的危机感都来源于哪里
  10. java 队列已满_JAVA中常见的阻塞队列详解