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 相关文章推荐
利用JQuery为搜索栏增加tag提示
Jun 22 Javascript
用JavaScript隐藏控件的方法
Sep 21 Javascript
jQuery事件用法详解
Oct 06 Javascript
AngularJS实现在ng-Options加上index的解决方法
Nov 03 Javascript
详解Python中logging日志模块在多进程环境下的使用
Dec 26 Javascript
聊聊JavaScript如何实现继承及特点
Apr 07 Javascript
JavaScript生成指定范围随机数和随机序列的方法
May 05 Javascript
讲解vue-router之命名路由和命名视图
May 28 Javascript
小程序实现人脸识别功能(百度ai)
Dec 23 Javascript
axios携带cookie配置详解(axios+koa)
Dec 28 Javascript
VueQuillEditor富文本上传图片(非base64)
Jun 03 Javascript
浅谈vue中使用编辑器vue-quill-editor踩过的坑
Aug 03 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
压力如何影响浓缩咖啡品质
2021/03/03 咖啡文化
PHP.ini中配置屏蔽错误信息显示和保存错误日志的例子
2014/05/12 PHP
3款值得推荐的微信开发开源框架
2014/10/28 PHP
PHP常用的排序和查找算法
2015/08/06 PHP
php实现图片以base64显示的方法
2016/10/13 PHP
PHP实现基于状态的责任链审批模式详解
2019/05/31 PHP
javascript 跨浏览器开发经验总结(五) js 事件
2010/05/19 Javascript
js 火狐下取本地路径实现思路
2013/04/02 Javascript
php,js,css字符串截取的办法集锦
2014/09/26 Javascript
javascript实现当前页导航激活的方法
2015/02/27 Javascript
百度UEditor编辑器如何关闭抓取远程图片功能
2015/03/03 Javascript
jQuery手动点击实现图片轮播特效
2020/04/20 Javascript
js跨浏览器的事件侦听器和事件对象的使用方法
2015/12/17 Javascript
火狐和ie下获取javascript 获取event的方法(推荐)
2016/11/26 Javascript
bootstrap表格分页实例讲解
2016/12/30 Javascript
自定义vue组件发布到npm的方法
2018/05/09 Javascript
详解组件库的webpack构建速度优化
2018/06/18 Javascript
微信小程序简单的canvas裁剪图片功能详解
2019/07/12 Javascript
vue element 中的table动态渲染实现(动态表头)
2019/11/21 Javascript
Vue实现跑马灯效果
2020/05/25 Javascript
解决vue页面渲染但dom没渲染的操作
2020/07/27 Javascript
使用 Python 获取 Linux 系统信息的代码
2014/07/13 Python
Python3 修改默认环境的方法
2019/02/16 Python
使用Python3内置文档高效学习以及官方中文文档
2019/05/19 Python
利用selenium爬虫抓取数据的基础教程
2019/06/10 Python
python PyQt5/Pyside2 按钮右击菜单实例代码
2019/08/17 Python
python爬虫 批量下载zabbix文档代码实例
2019/08/21 Python
python KNN算法实现鸢尾花数据集分类
2019/10/24 Python
python plotly画柱状图代码实例
2019/12/13 Python
HTML5 MiranaVideo播放器 (代码开源)
2010/06/11 HTML / CSS
英国最大的香水商店:The Fragrance Shop
2018/07/06 全球购物
学生逃课万能检讨书2000字
2015/02/17 职场文书
酒店采购员岗位职责
2015/04/03 职场文书
老乡聚会通知
2015/04/23 职场文书
2016年小学植树节活动总结
2016/03/16 职场文书
Pytorch中使用ImageFolder读取数据集时忽略特定文件
2022/03/23 Python