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 相关文章推荐
百度地图自定义控件分享
Mar 04 Javascript
完美实现仿QQ空间评论回复特效
May 06 Javascript
整理Javascript事件响应学习笔记
Dec 02 Javascript
JavaScript学习笔记整理之引用类型
Jan 22 Javascript
喜大普奔!jQuery发布 3.0 最终版
Jun 12 Javascript
深入理解React中es6创建组件this的方法
Aug 29 Javascript
jQuery Tree Multiselect使用详解
May 02 jQuery
jQuery实现新闻播报滚动及淡入淡出效果示例
Mar 23 jQuery
为什么使用koa2搭建微信第三方公众平台的原因
May 16 Javascript
angularjs性能优化的方法
Sep 05 Javascript
vue-以文件流-blob-的形式-下载-导出文件操作
Aug 07 Javascript
一篇文章学会Vue中间件管道
Jun 20 Vue.js
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
单一index.php实现PHP任意层级文件夹遍历(Zjmainstay原创)
2012/07/31 PHP
基于php常用函数总结(数组,字符串,时间,文件操作)
2013/06/27 PHP
php生成EAN_13标准条形码实例
2013/11/13 PHP
ThinkPHP实现带验证码的文件上传功能实例
2014/11/01 PHP
JS 文件传参及处理技巧分析
2010/05/13 Javascript
jquery下实现overlay遮罩层代码
2010/08/25 Javascript
jquery根据锚点offset值实现动画切换
2014/09/11 Javascript
封装好的js判断操作系统与浏览器代码分享
2015/01/09 Javascript
js使用setTimeout实现定时炸弹的方法
2015/04/10 Javascript
vue2的todolist入门小项目的详细解析
2017/05/11 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
2017/11/10 Javascript
jQuery插件jsonview展示json数据
2018/05/26 jQuery
Vue动态获取width的方法
2018/08/22 Javascript
Vue列表渲染的示例代码
2018/11/01 Javascript
Vue分页器实现原理详解
2019/06/28 Javascript
Javascript模块化机制实现原理详解
2020/04/02 Javascript
使用Python脚本来获取Cisco设备信息的示例
2015/05/04 Python
Python中http请求方法库汇总
2016/01/06 Python
Pycharm学习教程(6) Pycharm作为Vim编辑器使用
2017/05/03 Python
Python中元组,列表,字典的区别
2017/05/21 Python
python实现用户答题功能
2018/01/17 Python
在python环境下运用kafka对数据进行实时传输的方法
2018/12/27 Python
python实现XML解析的方法解析
2019/11/16 Python
django实现HttpResponse返回json数据为中文
2020/03/27 Python
详解CSS3弹性伸缩盒
2020/09/21 HTML / CSS
中东奢侈品购物网站:Ounass
2020/09/02 全球购物
面试求职的个人自我评价
2013/11/16 职场文书
公司成立感言
2014/01/11 职场文书
销售简历自我评价
2014/01/24 职场文书
教师师德师风个人整改方案
2014/09/18 职场文书
感恩母亲节活动总结
2015/02/10 职场文书
银行实习推荐信
2015/03/27 职场文书
总结会主持词
2015/07/02 职场文书
高中同学会致辞
2015/08/01 职场文书
《爬天都峰》教学反思
2016/02/23 职场文书
2019感恩宣传标语!
2019/07/05 职场文书