详解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 相关文章推荐
js树形控件脚本代码
Jul 24 Javascript
纯JS实现旋转图片3D展示效果
Apr 12 Javascript
JS实现两表格里数据来回转移的方法
May 28 Javascript
jQuery幻灯片特效代码分享--鼠标滑过按钮时切换(2)
Nov 18 Javascript
使用jquery插件qrcode生成二维码
Oct 22 Javascript
jQuery自定义插件详解及实例代码
Dec 29 Javascript
用jQuery旋转插件jqueryrotate制作转盘抽奖
Feb 10 Javascript
使用JavaScript实现表格编辑器(实例讲解)
Aug 02 Javascript
微信小程序实现多宫格抽奖活动
Apr 15 Javascript
JavaScript正则表达式函数总结(常用)
Feb 22 Javascript
vuejs项目打包之后的首屏加载优化及打包之后出现的问题
Apr 01 Javascript
vue打包通过image-webpack-loader插件对图片压缩优化操作
Nov 12 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 无限分类的树类代码
2009/12/03 PHP
php实现的百度搜索某地天气的小偷代码
2014/04/23 PHP
php支付宝在线支付接口开发教程
2016/09/19 PHP
微信公众号开发之获取位置信息php代码
2018/06/13 PHP
(jQuery,mootools,dojo)使用适合自己的编程别名命名
2010/09/14 Javascript
js 自动播放的实例代码
2013/11/19 Javascript
jquery实现浮动在网页右下角的彩票开奖公告窗口代码
2015/09/04 Javascript
基于Jquery easyui 选中特定的tab
2015/11/17 Javascript
基于canvas实现的钟摆效果完整实例
2016/01/26 Javascript
jQuery+CSS3实现仿花瓣网固定顶部位置带悬浮效果的导航菜单
2016/09/21 Javascript
node.js缺少mysql模块运行报错的解决方法
2016/11/13 Javascript
vue模板语法-插值详解
2017/03/06 Javascript
jQuery中animate()的使用方法及解决$(”body“).animate({“scrollTop”:top})不被Firefox支持的问题
2017/04/04 jQuery
javascript匿名函数中的'return function()'作用
2018/10/15 Javascript
js嵌套的数组扁平化:将多维数组变成一维数组以及push()与concat()区别的讲解
2019/01/19 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
p5.js实现简单货车运动动画
2019/10/23 Javascript
浅谈Webpack4 Tree Shaking 终极优化指南
2019/11/18 Javascript
JavaScript原型继承和原型链原理详解
2020/02/04 Javascript
Vue CLI4 Vue.config.js标准配置(最全注释)
2020/06/05 Javascript
python关键字and和or用法实例
2015/05/28 Python
Python 多线程抓取图片效率对比
2016/02/27 Python
Python 数据结构之队列的实现
2017/01/22 Python
Python算法之求n个节点不同二叉树个数
2017/10/27 Python
Python之ReportLab绘制条形码和二维码的实例
2018/01/15 Python
Python subprocess库的使用详解
2018/10/26 Python
对python 树状嵌套结构的实现思路详解
2019/08/09 Python
浅谈matplotlib.pyplot与axes的关系
2020/03/06 Python
Django REST framwork的权限验证实例
2020/04/02 Python
总经理办公室主任岗位职责
2013/11/12 职场文书
采购类个人求职的自我评价
2014/02/18 职场文书
遗产继承公证书
2014/04/09 职场文书
高中运动会广播稿
2014/09/16 职场文书
单位个人查摆问题及整改措施
2014/10/28 职场文书
2015年宣传思想工作总结
2015/05/22 职场文书
JavaScript ES6的函数拓展
2022/01/18 Javascript