vue:如何通过两个点的经纬度进行距离的计算(很简单)

首先假设从api获取到了自己的纬经度和别人的纬经度

首先有一个概念需要说一下

地球半径

由于地球不是一个完美的球体,所以并不能用一个特别准确的值来表示地球的实际半径,不过由于地球的形状很接近球体,用[6357km] 到 [6378km]的范围值可以涵盖需要的所有半径。并且通常情况下,地球半径有几个常用值:

极半径,从地球中心至南极或北极的距离, 相当于6356.7523km; 赤道半径,从地球中心到赤道的距离,大约6378.137km; 平均半径,6371.393km,表示地球中心到地球表面所有各点距离的平均值; RE,地球半径,有时被使用作为距离单位, 特别是在天文学和地质学中常用,大概距离是6370.856km;

所以我们通过地球半径进行计算的时候,通常情况下,我们可以使用上面的每一个值都可以进行计算,不过或多或少都会有误差的,但这样的误差是也是允许存在的。最后通过let f = e.toFixed(2)保留距离的两位小数

通过生命周期函数mouted获取当前两个位置的距离

运行结果

这样就可以完成通过经纬度进行距离的计算了是不是很简单实用,直接复制粘贴方法调用就可以使用了。

方法:

calculateDistance(lat1, lon1, lat2, lon2) { //计算两点之间的距离
				console.log('lat1, lon1, lat2, lon2', lat1, lon1, lat2, lon2)
				let R = 6371; //地球半径
				let dLat = this.deg2rad(lat2 - lat1)
				let dLon = this.deg2rad(lon2 - lon1)
				let a =
					Math.sin(dLat / 2) * Math.sin(dLat / 2) +
					Math.cos(this.deg2rad(lat1)) * Math.cos(this.deg2rad(lat2)) *
					Math.sin(dLon / 2) * Math.sin(dLon / 2);
				let c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
				let d = R * c; // 距离,单位:千米  
				let e = parseFloat(d)
				let f = e.toFixed(2)
				return f;
			},
 deg2rad(deg) {
			 return deg * (Math.PI / 180)
			},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/550495.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

板式热交换器强度

1、不同标准中对于板换压板的规定 (1) NB/T 47004.1-2017《板式热交换器 第1部分:可拆卸板式热交换器》6.3压紧板6.3.3条“压紧板应有足够的刚性,以保证板式热交换器在正常操作状态不发生泄漏”。 (2) NB/T 47004-2009《板式热交换器》5.3紧板5.3.3条“…

Springboot+Vue项目-基于Java+MySQL的蜗牛兼职网系统(附源码+演示视频+LW)

大家好!我是程序猿老A,感谢您阅读本文,欢迎一键三连哦。 💞当前专栏:Java毕业设计 精彩专栏推荐👇🏻👇🏻👇🏻 🎀 Python毕业设计 &…

每日一题 — 串联所有单词的子串

30. 串联所有单词的子串 - 力扣(LeetCode) 思路:因为words里面的每一个字符串的长度都是固定的,所以可以将题转换成字符在字符串中的所有异位词 设出哈希表定义left和right进窗口维护count判断出窗口维护count 代码: …

[html]一个动态js倒计时小组件

先看效果 代码 <style>.alert-sec-circle {stroke-dasharray: 735;transition: stroke-dashoffset 1s linear;} </style><div style"width: 110px; height: 110px; float: left;"><svg style"width:110px;height:110px;"><cir…

【Qt】:界面优化(一:基本语法)

界面优化 一.基本语法1.设置指定控件样式2.设置全局控件样式3.从文件加载样式表4.使⽤Qt Designer编辑样式&#xff08;最常用&#xff09; 二.选择器1.概述2.子控件选择器3.伪类型选择器 三.盒模型 在网页前端开发领域中,CSS是一个至关重要的部分.描述了一个网页的"样式&…

快速删除node_modules依赖包的命令rimraf

1、安装rimraf npm install -g rimraf 2、使用命令删除node_modules rimraf node_modules *** window系统&#xff0c;使用命令很快就删除node_modules ***

Jmeter 场景测试:登录--上传--下载--登出

为了练习Jmeter的使用&#xff0c;今天我要测试的场景是“登录--上传--下载--登出”这样一个过程. 测试的目标是我曾经练手写的一个文件分享系统&#xff0c;它要求用户只有登录后才可以下载想要的文件。 Jmeter总体结构&#xff1a; 第一步&#xff1a;添加HTTP Cookie管理器…

微信公众号-获取用户位置

目前获取方式为&#xff0c;在用户进入公众号时&#xff0c;提示是否允许获取地理位置&#xff0c;允许后&#xff0c;将地理位置在每次进入公众号时上报给公众号。 则可以根据公众号开发文档&#xff0c;进行上报提示&#xff0c;例如引入邮件系统&#xff0c;进行管理员提示&…

vscode如何方便地添加todo和管理todo

如果想在vscode中更加方便的添加和管理TODO标签&#xff0c;比如添加高亮提醒和查看哪里有TODO标签等&#xff0c;就可以通过安装插件快速实现。 安装插件 VSCode关于TODO使用人数最多的插件是TODO Height和Todo Tree 按住 CtrlShiftX按键进入应用扩展商店&#xff0c;输入to…

Jmeter03:直连数据库

1 Jmete组件&#xff1a;直连数据库 1.1 是什么&#xff1f; 让Jmeter直接和数据库交互 1.2 为什么&#xff1f; 之前是通过接口操作数据库&#xff0c;可能出现的问题&#xff1a;比如查询可能有漏查误查的情况&#xff0c;解决方案是人工对不&#xff0c;效率低且有安全隐患…

【C++题解】1317. 正多边形每个内角的度数?

问题&#xff1a;1317. 正多边形每个内角的度数&#xff1f; 类型&#xff1a;基本运算、小数运算 题目描述&#xff1a; 根据多边形内角和定理&#xff0c;正多边形内角和等于&#xff1a;&#xff08; n&#xff0d;2 &#xff09; 180∘ ( n 大于等于 3 且 n 为整数&#…

STM32 PB3 PB4 无法作为 GPIO 使用解决办法

如下所示&#xff0c;PA13 PA14 PB3 PB4 PB5, 默认是JTAG SWD的 PIN, 需要引脚ReMap 才能作为GPIO 使用。 HAL库解决办法 // __HAL_AFIO_REMAP_SWJ_ENABLE(); //Full SWJ (JTAG-DP SW-DP):// __HAL_AFIO_REMAP_SWJ_NONJTRST(); //Full SWJ (JTAG-DP SW-DP) but without NJTR…

Spring Boot JNA 实现调用 DLL文件(清晰明了)

概述 项目需要用到 重采样算法&#xff0c;JAVA 没有现成的&#xff0c;只能通过 JNA 调用 C 的 DLL 实现&#xff0c;JNA中&#xff0c;它提供了一个动态的C语言编写的转发器&#xff0c;可以自动实现Java和C的数据类型映射。不再需要编写C动态链接库。 实现需求 根据 一个…

Python赋能AI数据分析开启人工智能新时代

文章目录 一、Python是办公自动化的重要工具二、Python是提升职场竞争力的利器三、Python是企业数字化的重要平台四、Python是AI发展的重要通道之一《编程菜鸟学Python数据分析》编辑推荐内容简介作者简介目录前言为什么要写这本书读者对象如何阅读本书 随着我国企业数字化和信…

【位运算 子集状态压缩】982按位与为零的三元组

算法可以发掘本质&#xff0c;如&#xff1a; 一&#xff0c;若干师傅和徒弟互有好感&#xff0c;有好感的师徒可以结对学习。师傅和徒弟都只能参加一个对子。如何让对子最多。 二&#xff0c;有无限多1X2和2X1的骨牌&#xff0c;某个棋盘若干格子坏了&#xff0c;如何在没有坏…

握手问题(蓝桥杯)

文章目录 握手问题【问题描述】答案&#xff1a;1204解题思路模拟 握手问题 【问题描述】 小蓝组织了一场算法交流会议&#xff0c;总共有 50 人参加了本次会议。在会议上&#xff0c;大家进行了握手交流。按照惯例他们每个人都要与除自己以外的其他所有人进行一次握手&#…

Level protection and deep learning

1.模拟生成的数据 import randomdef generate_data(level, num_samples):if level not in [2, 3, 4]:return Nonedata_list []for _ in range(num_samples):# 构建指定等级的数据data str(level)for _ in range(321):data str(random.randint(0, 9))data_list.append(data)…

原型对象、实例、原型链的联系

const F function () { this.name Jack } // ƒ () { this.name Jack }const e new F() // F { name: "Jack" }console.log(e.name) // Jack 构造函数&#xff1a;现在 F 就是构造函数。任何一个函数被 new 使用后&#xff0c;就是构造函数&#xff0c;没被…

Opentelemetry——Sampling

Sampling 采样 Learn about sampling, and the different sampling options available in OpenTelemetry. 了解采样以及 OpenTelemetry 中提供的不同采样选项。 With distributed tracing, you observe requests as they move from one service to another in a distributed…

CentOS下gitlab迁移和升级_gitlab备份的可以通用centos和 ubuntu吗(1)

先自我介绍一下&#xff0c;小编浙江大学毕业&#xff0c;去过华为、字节跳动等大厂&#xff0c;目前阿里P7 深知大多数程序员&#xff0c;想要提升技能&#xff0c;往往是自己摸索成长&#xff0c;但自己不成体系的自学效果低效又漫长&#xff0c;而且极易碰到天花板技术停滞…
最新文章