基于高德地图的描点操作,监听地图缩放,展示合理数量的marker
来源:互联网 发布:问卷数据分析怎么写 编辑:程序博客网 时间:2024/06/06 02:36
1.根据两点经纬度算两点之间的距离函数
function Rad(d){ return d * Math.PI / 180.0;//经纬度转换成三角函数中度分表形式。 }//计算距离,参数分别为第一点的纬度,经度;第二点的纬度,经度function GetDistance(lat1,lng1,lat2,lng2){ var radLat1 = Rad(lat1); var radLat2 = Rad(lat2); var a = radLat1 - radLat2; var b = Rad(lng1) - Rad(lng2); var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a/2),2) + Math.cos(radLat1)*Math.cos(radLat2)*Math.pow(Math.sin(b/2),2))); s = s *6378.137 ;// EARTH_RADIUS; s = Math.round(s * 10000) / 10000; //输出为公里 //s=s.toFixed(4); return s;}
2.给地图绑定监听事件
map.on("zoomchange",function(){ for (var i = pathContentArr.length - 1; i >= 0; i--) { pathContentArr[i].setMap(null); } for (var i = pathMarkerArr.length - 1; i >= 0; i--) { pathMarkerArr[i].setMap(null); } pathMarkerArr=[]; pathContentArr=[]; drawMarkerByDistance(map.getZoom()) })
3.drawMarkerByDistance函数【会根据第i个点和第i+1个点之间的距离进行初步筛选,其中select函数对初步筛选出来的点进行了所有点两两之间距离的二次筛选】
function drawMarkerByDistance(zoom){ var perDistance=0; //当前累计公里数 var zoom=zoom||6; switch (zoom){ case 3: var targetDistance=800; //km break; case 4: var targetDistance=400; //km break; case 5: var targetDistance=200; //km break; case 6: var targetDistance=120; //km break; case 7: var targetDistance=60; //km break; case 8: var targetDistance=30; //km break; case 9: var targetDistance=15; //km break; case 10: var targetDistance=7; //km break; case 11: var targetDistance=4; //km break; case 12: var targetDistance=1; //km break; case 13: var targetDistance=0.5; //km break; default: var targetDistance=0.25; //km } var prepareToShowMarker=[]; for (var i = 0; i < curShipPolyLineData.length; i++) { //第一个点和最后一个点默认展示出来,累计长度大于目标长度的画出来 if (i==0||i==curShipPolyLineData.length-1 || (curShipPolyLineData[i].distance+perDistance)>targetDistance) { var marker={ lat:parseFloat(curShipPolyLineData[i].latitude), lng:parseFloat(curShipPolyLineData[i].longitude), course:curShipPolyLineData[i].course, AddTime: curShipPolyLineData[i].AddTime, } prepareToShowMarker.push(marker); } if(i<curShipPolyLineData.length-1 && i>1){ if ((curShipPolyLineData[i].distance+perDistance)>targetDistance) { perDistance=0; }else{ perDistance+=curShipPolyLineData[i].distance; } } } var select=function(arr){ var flag=true; for(var i=0;i<arr.length;i++){ for(var j=i+1;j<arr.length;j++){ var curdistance=GetDistance(arr[i].lat,arr[i].lng,arr[j].lat,arr[j].lng); //如果还有靠得很近的点 if (curdistance<targetDistance) { flag=false; //随机剔除掉一个i和j之间的一个点 Math.random()>0.5?arr.splice(i,1):arr.splice(j,1); break; } } if(flag==false){ break; } } //当数组中所有的点两两之间的距离都大于targetDistance的时候退出递归 if (flag==false) { select(arr); } } select(prepareToShowMarker); for (var i = prepareToShowMarker.length - 1; i >= 0; i--) { var position=[prepareToShowMarker[i].lng,prepareToShowMarker[i].lat]; var content = new AMap.Marker({ content:prepareToShowMarker[i].AddTime, position: position, title: prepareToShowMarker[i].AddTime, offset:new AMap.Pixel(20,0), map: map }); pathContentArr.push(content); var marker = new AMap.Marker({ offset:new AMap.Pixel(0,0), icon:"new_images/arrow_r.png", angle:((prepareToShowMarker[i].course-90)%360), position: position, map: map }); pathMarkerArr.push(marker); } }
0 0
- 基于高德地图的描点操作,监听地图缩放,展示合理数量的marker
- 高德地图之地图篇----->定位的蓝点、添加Marker
- 高德地图的缩放和位移监听
- 高德地图添加Marker点标记
- 地图缩放后Marker偏移的问题
- 百度地图api根据地图缩放等级显示不同的marker点
- 关于高德地图 自定义Marker使用自己的XMl布局的操作
- 关于高德地图 自定义Marker使用自己的XMl布局的操作
- 高德地图自定义marker的图片定位的问题
- 我的高德地图之定位,Marker,位置信息。
- 高德地图 amap 显示 marker和自定义的infoWindow
- 高德地图自定义Marker点击时出现的InfoWindow
- 高德地图Marker的管理(添加,删除)
- Android高德地图Marker的隐藏与重现
- Android 高德地图移除指定的marker
- 关于高德地图添加Marker遇到的一些坑
- 高德地图自定义marker不显示的问题
- (10.14更新)关于高德地图安卓SDK的一些使用细节坑(包括Marker与缩放地图)
- 各数据库连接数据库中db.properties中的写法
- Spring MVC获取所有注册的url
- 两种方法增加oracle表空间
- 关于 Des加密(Android与ios 与后台java服务器之间的加密解密)
- TextView使用自定义HtmlHttpImageGetter实现异步加载网络图片,可限制加载图片数量
- 基于高德地图的描点操作,监听地图缩放,展示合理数量的marker
- 通过iMindMap改善你的工作方式的方法
- yii2 session 的原理
- 让任正非愤怒的到底是华为财管团队还是流程本身?
- Tomcat远程调试-IDEA工具
- 跳跃表-原理及Java实现
- mybatis源码学习——Exception包
- JSP的9个内置对象之response
- without a valid mediaplayer