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

2024-10-20 01:13:15

正常在使用百度地图时，我们可以通过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根据百度地图提供经纬度计算两点距离详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

JS使用百度地图API自动获取地址和经纬度操作示例

本文实例讲述了JS使用百度地图API自动获取地址和经纬度操作.分享给大家供大家参考,具体如下: 在实际工作中我们经常会遇到这样的问题,但是当我们去看百度API的时候往往又达不到我们的要求. 故此,本篇博文讲述如何使用百度地图API自动获取地址和经纬度: 1.HTML代码如下 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xht
js 获取经纬度的实现方法

js 获取经纬度的实现方法  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" &quo
Android编程实现根据经纬度查询地址并对获取的json数据进行解析的方法

本文实例讲述了Android编程实现根据经纬度查询地址并对获取的json数据进行解析的方法.分享给大家供大家参考,具体如下: 第一步:根据指定的URL从google 服务器上获得包含地址的json格式的数据(其还提供xml格式的,但json解析效率比xml高) private static StringBuffer getJSONData(String urlPath){ try { URL url = new URL(urlPath); HttpURLConnection httpURLCon
JS实现根据详细地址获取经纬度功能示例

本文实例讲述了JS实现根据详细地址获取经纬度功能.分享给大家供大家参考,具体如下: 这个功能还是比较实用的,记录分享一下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>根据地址查询经纬度</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8
基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标

前言近来由于工作需要,需要提取某些城市的经纬度坐标,稍微搜索了一下,发现百度地图和高德地图都提供了相关的函数和例子.那么剩余的工作也就比较简单了,保存坐标,然后转换为WGS坐标,这样才能和现有的GPS数据以及地图匹配. 主要问题和解决方法本地保存文件跨浏览器支持由于安全的原因,JavaScript本地保存文件的方式通常都只有IE支持的ActiveXObject/Open方法,每次都要提示不安全和允许运行,非常麻烦.好在其他浏览器目前都支持<a>标签实现文件下载的方法.经测试最新的Goog
用NodeJS实现批量查询地理位置的经纬度接口

实现步骤 1. 查询接口网站上这种类型的接口还不少,笔者直接找了百度地图的接口做,接口文档,调用的API是Geocoding API中的地理编码服务请求示例:对北京市百度大厦进行地理编码查询 http://api.map.baidu.com/geocoder/v2/?ak=E4805d16520de693a3fe707cdc962045&callback=renderOption&output=json&address=百度大厦&city=北京市这里面需要一个ak参数
根据经纬度计算地球上两点之间的距离js实现代码

利用JS实现的根据经纬度计算地球上两点之间的距离最近用到了根据经纬度计算地球表面两点间距离的公式,然后就用JS实现了一下. 计算地球表面两点间的距离大概有两种办法. 第一种是默认地球是一个光滑的球面,然后计算任意两点间的距离,这个距离叫做大圆距离(The Great Circle Distance). 公式如下: 使用JS来实现为: 复制代码代码如下: var EARTH_RADIUS = 6378137.0; //单位M var PI = Math.PI; function getRad(
JavaScript实现经纬度转换成地址功能

在webAPP开发过程中,需要将返回的经纬度转换成中文地址,一番折腾后得以实现,总结如下原理分析: 百度地图API提供了一个JS库,我们只需要用这个接口就可以实现转换功能,这里我写一个简单的demo,与君共勉 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewpor
详解js根据百度地图提供经纬度计算两点距离

正常在使用百度地图时,我们可以通过BMap的实例对象提供的方法计算距离: var map = new BMap.Map('map_canvas'); map.getDistance(point1 ,point2); //point1.point2 是Point对象如果在不使用百度地图,但是已知百度地图的经纬度情况下也是可以计算出与上面相同的值的三方库此库提供计算两点距离的方法引用此库使用返回(米) BMapLib.GeoUtils.getDistance(point1 ,point2)
详解JS浏览器储存

引言随着对前端的了解越来越深入,了解到了很多种浏览器的存储方案,如 Cookie.LocalStorage等,哪这些存储方案有何异同,分别的适用场景又是什么呢. Cookie Cookie的来源 Cookie 被创造出来的本意并不是本地储存,而是为了辨别用户身份.众所周知,Http 协议是无状态的,也就是说你每一次发送给服务器的请求对于服务器来说都是孤立的,服务器不知道这这些请求来自于谁.比如你向购物车里面添加了一些商品,但是当发送结账请求的时候服务器懵了,我怎么知道你是谁,你买了什么呢.而使
详解JS数组Reduce()方法详解及高级技巧

基本概念 reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组. 语法: arr.reduce(callback,[initialValue]) callback (执行数组中每个值的函数,包含四个参数) previousValue (上
详解JS数值Number类型

Number 问题下面的问题你都能回答对了吗? 0.1 + 0.2 == 0.3 成立吗? .e-5 表示多少? 怎么表示8进制? 怎么转换进制? 如何将字符串转换成数值或整数?反过来呢?十六进制又怎么处理? parseInt(0x12, 16) 的返回值是多少?是0x12吗? Number.MAX_VALUE 为最大数值,(new Number(12)).MAX_VALUE 是多少? JavaScript中怎么进行四舍五入?如果保留3位小数的精度? 如何获取一个随机数?如何取整?如何向上取整
详解JS深拷贝与浅拷贝

一.预备知识 1.1.JS数据类型基本数据类型:Boolean.String.Number.null.undefined 引用数据类型:Object.Array.Function.RegExp.Date等 1.2.数据类型的复制基本数据类型的复制,是按值传递的 var a = 1; var b = a; b = 2; console.log(a); // 1 console.lob(b); // 2 引用数据类型的复制,是按引用传值 var obj1 = { a: 1; b: 2; }; v
详解Js模块化的作用原理和方案

一.模块化概念将一个复杂的程序依据一定的规则(规范)封装成几个块(文件), 并进行组合在一起:块的内部数据与实现是私有的, 只是向外部暴露一些接口(方法)与外部其它模块通信. 二.模块化作用为什么要用模块化的JavaScript? 因为在实际的开发过程中,经常会遇到变量.函数.对象等名字的冲突,这样就容易造成冲突,还会造成全局变量被污染: 同时,程序复杂时需要写很多代码,而且还要引入很多类库,这样稍微不注意就容易造成文件依赖混乱: 为了解决上面的的问题,我们才开始使用模块化的js,所以说模块
详解JS ES6变量的解构赋值

1.什么是解构? ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构.它在语法上比ES5所提供的更加简洁.紧凑.清晰.它不仅能减少你的代码量,还能从根本上改变你的编码方式. 2.数组解构以前,为变量赋值,我们只能直接指定值,比如 let a = 1; let b = 2; let c = 3; 现在可以用数组解构的方式来进行赋值 let [a, b, c] = [1, 2, 3]; console.log(a, b, c); // 1, 2, 3 这是数组解构最基本类型
详解JS中的对象字面量

前言在 ES6 之前,js中的对象字面量(也称为对象初始化器)是非常基础的.可以定义两种类型的属性: 键值对{name1: value1} 获取器{ get name(){..} }和设置器{ set name(val){..}}的计算属性值 var myObject = { myString: 'value 1', get myNumber() { return this._myNumber; }, set myNumber(value) { this._myNumber = Number
详解JS ES6编码规范

1.块级作用域 1.1.let取代var ES6 提出了两个新的声明变量的命令: let 和const.其中,let可以完全取代var,因为两者语义相同,而且let没有副作用. var命令存在变量提升的特性,而let没有这个命令. 所谓变量提升,即指变量可以先使用,再声明,显然,这种编码规范非常不适合阅读. 1.2.全局常量和线程安全在let和const之间,优先使用const. let应出现在单线程模块代码内,而const则非常适合多线程. // bad var a = 1, b = 2,

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

相关推荐

随机推荐