百度地图多个坐标连成轨迹 博客分类: htmljs 百度地图多个坐标点轨迹
程序员文章站
2024-02-25 08:28:40
...
背景:平时app端上传时会由于各种原因,上传的坐标点可能不是完整的。
解决方案:两两坐标点建立连接,最终组成一个完整的轨迹!
参考:
http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html (js api)
http://lbsyun.baidu.com/jsdemo.htm#i5_2 (主要原理)
http://www.cnblogs.com/wujy/p/3897501.html (这位兄弟写的好详细,主要参考他这边的 )
截图:
附:百度轨迹查询若参数有传纠偏(is_process=1&process_option=[...]),返回的数据定位时间有的可能会重复,要根据loc_time剔重下!
解决方案:两两坐标点建立连接,最终组成一个完整的轨迹!
参考:
http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html (js api)
http://lbsyun.baidu.com/jsdemo.htm#i5_2 (主要原理)
http://www.cnblogs.com/wujy/p/3897501.html (这位兄弟写的好详细,主要参考他这边的 )
var data = [ [119.307268,26.087294], [119.300908,26.085607], [119.299399,26.089598], [119.305363,26.092161] ]; // 根据轨迹点,两两连线,最终合成一条完整的轨迹 function showMap() { var abc = $(data); var chartData = []; $.each(abc, function (item, value) { chartData.push(new BMap.Point(value[0], value[1])); }) for (var i = 0; i < chartData.length-1; i++) { var startPoint = chartData[i]; var endPoint = chartData[i + 1]; showPath(startPoint, endPoint,i==0,i==chartData.length-2); } } // 两个坐标点连线 function showPath(startPoint, EndPoint,displayStartIcon,displayEndIcon){ var walking = null; if(displayStartIcon && !displayEndIcon){ // 第一个起点只展示起点图标 walking = new BMap.DrivingRoute(map, { renderOptions: { map: map, autoViewport: true },onMarkersSet:function(routes) {map.removeOverlay(routes[1].marker);}}); }else if(!displayStartIcon && !displayEndIcon){//中间的起点终点不展示起点、终点图标 walking = new BMap.DrivingRoute(map, { renderOptions: { map: map, autoViewport: true },onMarkersSet:function(routes) {map.removeOverlay(routes[0].marker);map.removeOverlay(routes[1].marker);}}); }else{// 最后一个终点只展示终点图标 walking = new BMap.DrivingRoute(map, { renderOptions: { map: map, autoViewport: true },onMarkersSet:function(routes) {map.removeOverlay(routes[0].marker);}}); } walking.search(startPoint, EndPoint); }
截图:
附:百度轨迹查询若参数有传纠偏(is_process=1&process_option=[...]),返回的数据定位时间有的可能会重复,要根据loc_time剔重下!