详解js根据百度地图提供经纬度计算两点距离


Posted in Javascript onMay 13, 2019

正常在使用百度地图时,我们可以通过BMap的实例对象提供的方法计算距离:

var map = new BMap.Map('map_canvas');
map.getDistance(point1 ,point2);
//point1、point2 是Point对象

如果在不使用百度地图,但是已知百度地图的经纬度情况下也是可以计算出与上面相同的值的

三方库 此库提供计算两点距离的方法

引用此库使用 返回(米)

BMapLib.GeoUtils.getDistance(point1 ,point2)

当然如果只想计算距离也可以直接用下面的代码:

注:BMap需要导入,使用如下:

BMapLib.GeoUtils.getDistance(lng1,lat1,lng2,lat2)

import BMap from 'BMap'
 
var BMapLib = window.BMapLib = BMapLib || {};
 (function() {
 
     /**
      * 地球半径
      */
     var EARTHRADIUS = 6370996.81;
 
     /**
      * @exports GeoUtils as BMapLib.GeoUtils
      */
     var GeoUtils =
       /**
      * GeoUtils类,静态类,勿需实例化即可使用
      * @class GeoUtils类的<b>入口</b>。
      * 该类提供的都是静态方法,勿需实例化即可使用。
      */
     BMapLib.GeoUtils = function(){
 
       };
 
     /**
      * 将度转化为弧度
      * @param {degree} Number 度
      * @returns {Number} 弧度
      */
     GeoUtils.degreeToRad = function(degree){
         return Math.PI * degree/180;
       }
 
     /**
      * 将v值限定在a,b之间,纬度使用
      */
     function _getRange(v, a, b){
         if(a != null){
            v = Math.max(v, a);
           }
         if(b != null){
            v = Math.min(v, b);
           }
         return v;
       }
 
     /**
     * 将v值限定在a,b之间,经度使用
     */
     function _getLoop(v, a, b){
         while( v > b){
            v -= b - a
           }
         while(v < a){
            v += b - a
           }
         return v;
       }
   /**
    * 计算两点之间的距离,两点坐标必须为经纬度
    * @param {lng1} Number 点对象
    * @param {lat1} Number 点对象
    * @param {lng2} Number 点对象
    * @param {lat2} Number 点对象
    * @returns {Number} 两点之间距离,单位为米
    */
     GeoUtils.getDistance = function(lng1, lat1, lng2 ,lat2){
         let point1 = new BMap.Point(parseFloat(lng1) ,parseFloat(lat1));
         let point2 =new BMap.Point(parseFloat(lng2) ,parseFloat(lat2));
         //判断类型
         if(!(point1 instanceof BMap.Point) ||
             !(point2 instanceof BMap.Point)){
             return 0;
           }
         point1.lng = _getLoop(point1.lng, -180, 180);
         point1.lat = _getRange(point1.lat, -74, 74);
         point2.lng = _getLoop(point2.lng, -180, 180);
         point2.lat = _getRange(point2.lat, -74, 74);
         let x1, x2, y1, y2;
         x1 = GeoUtils.degreeToRad(point1.lng);
         y1 = GeoUtils.degreeToRad(point1.lat);
         x2 = GeoUtils.degreeToRad(point2.lng);
         y2 = GeoUtils.degreeToRad(point2.lat);
         return EARTHRADIUS * Math.acos((Math.sin(y1) * Math.sin(y2) + Math.cos(y1) * Math.cos(y2) * Math.cos(x2 - x1)));
       }
})();

以上所述是小编给大家介绍的js根据百度地图提供经纬度计算两点距离详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
获取任意Html元素与body之间的偏移距离 offsetTop、offsetLeft (For:IE5+ FF1 )[
Dec 22 Javascript
浅谈nodeName,nodeValue,nodeType,typeof 的区别
Jan 13 Javascript
JavaScript检测实例属性, 原型属性
Feb 04 Javascript
js实现圆盘记速表
Aug 03 Javascript
Javascript表单特效之十大常用原理性样例代码大总结
Jul 12 Javascript
JSON对象 详解及实例代码
Oct 18 Javascript
highcharts 在angular中的使用示例代码
Sep 20 Javascript
微信小程序websocket实现聊天功能
Mar 30 Javascript
如何为你的JS项目添加智能提示与类型检查详解
Mar 12 Javascript
ES6 十大特性简介
Dec 09 Javascript
Vue的生命周期一起来看看
Feb 24 Vue.js
JS前端使用Canvas快速实现手势解锁特效
Sep 23 Javascript
解决前后端分离 vue+springboot 跨域 session+cookie失效问题
May 13 #Javascript
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
May 13 #Javascript
详解async/await 异步应用的常用场景
May 13 #Javascript
轻松解决JavaScript定时器越走越快的问题
May 13 #Javascript
JavaScript Math对象和调试程序的方法分析
May 13 #Javascript
jsonp跨域获取百度联想词的方法分析
May 13 #Javascript
基于Fixed定位的框选功能的实现代码
May 13 #Javascript
You might like
PHP缓存技术的多种方法小结
2012/08/14 PHP
解析PHP中的file_get_contents获取远程页面乱码的问题
2013/06/25 PHP
初识php MVC
2014/09/10 PHP
PHP多维数组遍历方法(2种实现方法)
2015/12/10 PHP
PHP对象、模式与实践之高级特性分析
2016/12/08 PHP
JavaScript的面向对象(二)
2006/11/09 Javascript
jquery 新浪网易的评论块制作
2010/07/01 Javascript
JS遮罩层效果 兼容ie firefox jQuery遮罩层
2010/07/26 Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
2014/06/15 Javascript
使用jquery.validate自定义方法实现&quot;手机号码或者固话至少填写一个&quot;的逻辑验证
2014/09/01 Javascript
javascript 原型链维护和继承详解
2014/11/26 Javascript
jQuery中:only-child选择器用法实例
2015/01/03 Javascript
window.onload使用指南
2015/09/13 Javascript
详解ECharts使用心得总结
2016/12/06 Javascript
详解vue2.0脚手架的webpack 配置文件分析
2017/05/27 Javascript
JS按钮闪烁功能的实现代码
2017/07/21 Javascript
vue 弹框产生的滚动穿透问题的解决
2018/09/21 Javascript
Vue加载json文件的方法简单示例
2019/01/28 Javascript
详解Node.js一行命令上传本地文件到服务器
2019/04/22 Javascript
解决vue路由name同名,路由重复的问题
2020/08/05 Javascript
Python获取远程文件大小的函数代码分享
2014/05/13 Python
python中类变量与成员变量的使用注意点总结
2017/04/29 Python
Python Scapy随心所欲研究TCP协议栈
2018/11/20 Python
Python父目录、子目录的相互调用方法
2019/02/16 Python
python实现最大子序和(分治+动态规划)
2019/07/05 Python
Python学习笔记之集合的概念和简单使用示例
2019/08/22 Python
使用CSS3来制作消息提醒框
2015/07/12 HTML / CSS
旅游管理专业个人求职信范文
2013/12/24 职场文书
写好自荐信的几个要点
2013/12/26 职场文书
文化宣传方案
2014/03/13 职场文书
2014年五一活动策划方案
2014/03/15 职场文书
2014年药房工作总结
2014/11/22 职场文书
工程质检员岗位职责
2015/04/08 职场文书
初中家长意见
2015/06/03 职场文书
幼儿园见习总结
2015/06/23 职场文书
springboot中的pom文件 project报错问题
2022/01/18 Java/Android