Javascript计算两个marker之间的距离(Google Map V3)


Posted in Javascript onApril 26, 2013

Google Map V3 javascript计算两个marker之间的距离
做地图开发,最常用到的就是marker一些操作和交互。简单介绍一下,两个marker之间的距离计算。
google map api 很方便的 只要是常用的 基本上都有接口。
1.创建两个marker点

var oldMarker = new google.maps.Marker({ 
position: new google.maps.LatLng("31.95678", "177.898673"), 
map: map, 
title:"old" 
}); 
var newMarker = new google.maps.Marker({ 
position: new google.maps.LatLng("31.45678", "177.098673"), 
map: map, 
title:"new" 
});

2.加载geometry库
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry"></script>

说明:libraries=geometry
3.计算距离
var meters = google.maps.geometry.spherical.computeDistanceBetween(oldMarker.getPosition(), newMarker.getPosition()); 
document.getElementById("distance").innerText = meters+"米";

说明:单位是米
oldMarker.getPosition() 获取oldmarker的当前位置(经纬度)
Javascript 相关文章推荐
html下载本地
Jun 19 Javascript
[原创]静态页面也可以实现预览 列表不同的显示方式
Oct 14 Javascript
DOM和XMLHttpRequest对象的属性和方法整理
Jan 04 Javascript
js面向对象 多种创建对象方法小结
May 21 Javascript
javascript数组去重3种方法的性能测试与比较
Mar 26 Javascript
jquery实现一个简单好用的弹出框
Sep 26 Javascript
AngularJS Ajax详解及示例代码
Aug 17 Javascript
jquery结合html实现中英文页面切换
Nov 29 Javascript
工作中常用的js、jquery自定义扩展函数代码片段汇总
Dec 22 Javascript
微信小程序顶部导航栏滑动tab效果
Jan 28 Javascript
vuejs移动端实现div拖拽移动
Jul 25 Javascript
JS前端使用canvas实现扩展物体类和事件派发
Aug 05 Javascript
jquery中.add()的使用分析
Apr 26 #Javascript
Javascript 鼠标移动上去小三角形滑块缓慢跟随效果
Apr 26 #Javascript
jquery 关于event.target使用的几点说明介绍
Apr 26 #Javascript
用示例说明filter()与find()的用法以及children()与find()的区别分析
Apr 26 #Javascript
jQuery 遍历-nextUntil()方法以及prevUntil()方法的使用介绍
Apr 26 #Javascript
基于jquery的has()方法以及与find()方法以及filter()方法的区别详解
Apr 26 #Javascript
jQuery 遍历- 关于closest() 的方法介绍以及与parents()的方法区别分析
Apr 26 #Javascript
You might like
php设计模式 Adapter(适配器模式)
2011/06/26 PHP
分享微信扫码支付开发遇到问题及解决方案-附Ecshop微信支付插件
2015/08/23 PHP
php冒泡排序与快速排序实例详解
2015/12/07 PHP
ThinkPHP5.1表单令牌Token失效问题的解决
2019/03/22 PHP
Javascript 汉字字节判断
2009/08/01 Javascript
利用JQuery的load函数动态加载其它页面的内容的实现代码
2010/12/14 Javascript
仿中关村在线首页弹出式广告插件(jQuery版)
2012/05/03 Javascript
jquery实现简单合拢与展开网页面板的方法
2015/09/01 Javascript
js解决movebox移动问题
2016/03/29 Javascript
JavaScript函数节流概念与用法实例详解
2016/06/20 Javascript
浅谈jquery高级方法描述与应用
2016/10/04 Javascript
详解Vue路由开启keep-alive时的注意点
2017/06/20 Javascript
JavaScript中递归实现的方法及其区别
2017/09/12 Javascript
浅谈Node.js之异步流控制
2017/10/25 Javascript
React props和state属性的具体使用方法
2018/04/12 Javascript
微信小程序云开发获取文件夹下所有文件(推荐)
2019/11/14 Javascript
详解Python中的from..import绝对导入语句
2016/06/21 Python
Python基于FTP模块实现ftp文件上传操作示例
2018/04/23 Python
Tensorflow实现AlexNet卷积神经网络及运算时间评测
2018/05/24 Python
python实现socket+threading处理多连接的方法
2019/07/23 Python
Flask框架学习笔记之路由和反向路由详解【图文与实例】
2019/08/12 Python
Tensorflow矩阵运算实例(矩阵相乘,点乘,行/列累加)
2020/02/05 Python
python使用gdal对shp读取,新建和更新的实例
2020/03/10 Python
收集的22款给力的HTML5和CSS3帮助工具
2012/09/14 HTML / CSS
乌克兰网上服装店:Bolf.ua
2018/10/30 全球购物
物理系毕业生自荐信
2013/11/01 职场文书
中专毕业生自荐信
2013/11/16 职场文书
机关门卫岗位职责
2013/12/30 职场文书
给酒店员工的表扬信
2014/01/11 职场文书
雪山饭庄的创业计划书范文
2014/01/18 职场文书
校园十佳歌手策划书
2014/01/22 职场文书
个人委托书格式
2014/04/04 职场文书
勤俭节约演讲稿
2014/05/08 职场文书
解决python存数据库速度太慢的问题
2021/04/23 Python
vue elementUI表格控制对应列
2022/04/13 Vue.js
python中 Flask Web 表单的使用方法
2022/05/20 Python