JS实现百度地图同时显示多个路书效果
来源:爱站网时间:2020-08-31编辑:网友分享
地图是现代社会许多企业广泛使用的工具之一,它不仅可以提供各种路线规划的功能,还可以提供许多道路的辅助信息,从而规划出最佳的路线供用户选择,那么就让我们一起来了解一下JS实现百度地图同时显示多个路书效果吧!
地图是现代社会许多企业广泛使用的工具之一,它不仅可以提供各种路线规划的功能,还可以提供许多道路的辅助信息,从而规划出最佳的路线供用户选择,那么就让我们一起来了解一下JS实现百度地图同时显示多个路书效果吧!
启动路书:
var BMapLib = window.BMapLib = BMapLib || {}; (function() { var b, a = b = a || { version : "1.5.0" }; a.guid = "$BAIDU$"; (function() { window[a.guid] = window[a.guid] || {}; a.dom = a.dom || {}; a.dom.g = function(e) { if ("string" == typeof e || e instanceof String) { return document.getElementById(e) } else { if (e && e.nodeName && (e.nodeType == 1 || e.nodeType == 9)) { return e } } return null }; a.g = a.G = a.dom.g; a.lang = a.lang || {}; a.lang.isString = function(e) { return "[object String]" == Object.prototype.toString.call(e) }; a.isString = a.lang.isString; a.dom._g = function(e) { if (a.lang.isString(e)) { return document.getElementById(e) } return e }; a._g = a.dom._g; a.dom.getDocument = function(e) { e = a.dom.g(e); return e.nodeType == 9 ? e : e.ownerDocument || e.document }; a.browser = a.browser || {}; a.browser.ie = a.ie = /msie (\d+\.\d+)/i.test(navigator.userAgent) ? (document.documentMode || +RegExp["\x241"]) : undefined; a.dom.getComputedStyle = function(f, e) { f = a.dom._g(f); var h = a.dom.getDocument(f), g; if (h.defaultView && h.defaultView.getComputedStyle) { g = h.defaultView.getComputedStyle(f, null); if (g) { return g[e] || g.getPropertyValue(e) } } return "" }; a.dom._styleFixer = a.dom._styleFixer || {}; a.dom._styleFilter = a.dom._styleFilter || []; a.dom._styleFilter.filter = function(f, j, k) { for (var e = 0, h = a.dom._styleFilter, g; g = h[e]; e++) { if (g = g[k]) { j = g(f, j) } } return j }; a.string = a.string || {}; a.string.toCamelCase = function(e) { if (e.indexOf("-") = g) { clearInterval(i._intervalFlag); if (i.i > i._path.length) { return } i._moveNext(++i.i) } else { h++; var o = m(l.x, k.x, h, g), r = m( l.y, k.y, h, g), q = i._projection .pointToLngLat(new BMap.Pixel( o, r)); if (h == 1) { var p = null; if (i.i - 1 >= 0) { p = i._path[i.i - 1] } if (i._opts.enableRotation == true) { i.setRotation(p, n, j) } if (i._opts.autoView) { if (!i._map.getBounds() .containsPoint(q)) { i._map.setCenter(q) } } } i._marker.setPosition(q); i._setInfoWin(q) } }, e) }, setRotation : function(l, f, m) { var j = this; var e = 0; f = j._map.pointToPixel(f); m = j._map.pointToPixel(m); if (m.x != f.x) { var k = (m.y - f.y) / (m.x - f.x), g = Math .atan(k); e = g * 360 / (2 * Math.PI); if (m.x 0) { i = -1 } else { i = 1 } j._marker.setRotation(-i * 90) } return }, linePixellength : function(f, e) { return Math.sqrt(Math.abs(f.x - e.x) * Math.abs(f.x - e.x) + Math.abs(f.y - e.y) * Math.abs(f.y - e.y)) }, pointToPoint : function(f, e) { return Math.abs(f.x - e.x) * Math.abs(f.x - e.x) + Math.abs(f.y - e.y) * Math.abs(f.y - e.y) }, _moveNext : function(e) { var f = this; if (e
function showallrecord(starttime,endtime){//显示多条开始结束时间之间的自行车路书 var bikeId=null; $.getJSON("./GetBickIdServlet",function(json){ bikeId = json;//所有自行车编号 }); var json={ "StartTime":starttime,//开始时间 "EndTime":endtime//结束时间 }; //创建二维数组,例如pointArray[i]中i自行车编号,pointArray[i][j]为编号为i的自行车的所有借还站点信息 $.getJSON("./GetAllRecordServlet",{json:JSON.stringify(json)},function(json){ var j = 0; var stationlonlist=new Array(); var stationlatlist=new Array(); var pointArray=new Array(); var bikeIdlist = new Array(); for(var i = 0; i
function speedtest(pointArray,row){//根据自行车的借还时间差来显示不同的路书速度(待完善) var distance = 0;//直行车走过的路径长度 for(var i = 0; i =14); return sjshu; } function getColor(){ var hex = ['1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F']; var yanse=""; for(i=0; i
效果图:
以上就是给爱站技术频道小编为大家带来的JS实现百度地图同时显示多个路书效果,看完都知道怎么操作了吧,希望小编介绍的能帮到大家。
下一篇:JSP页面常见查询与显示方法分析