百度地圖js 畫執行軌跡之執行軌跡標註文字(三)
阿新 • • 發佈:2019-02-07
在執行軌跡中需要在起止點加上資訊提示,實現方法如下:
//加資訊提示的文字方法 setInfoBox:function (tracksPart,marker) { // var point = new BMap.Point(tracksPart.Longitude,tracksPart.Latitude); // var marker = new BMap.Marker(point); // 建立標註 // var sContent="<div style='width: 1rem;position: relative'>"+ // // +"<span style='position:absolute;bottom:-10px;left:40% '><img src='/asserts/img/static/teld_down_arrow.png'></span>"+ // +this.formartTZdate(tracksPart.RunTime)+"</div>"; var sContent="<div style='text-align:center'>" + "<span style='position: absolute;bottom: -18px;left: 40%;'>" + "<img src='/asserts/img/static/teld_down_arrow.png'></span>"+this.formartTZdate(tracksPart.RunTime)+"</div>"; // var label = new BMap.Label(sContent); // 建立資訊視窗物件 var sizeOffset=this.sizeBdLabel(); var sizeOffsetH=this.sizeBdLabelH(); var label = new BMap.Label(sContent,{ offset:new BMap.Size(sizeOffset,sizeOffsetH)//-20,-50 }); label.setStyle({ border:"1px solid #466d8f", borderRadius:"0.133rem",//10px backgroundColor:"#fff", width:"2.13rem",//80px padding:"0.15rem", fontSize:"0.32rem"//24px }); marker.setLabel(label); }, //地圖上文字提示資訊的位置適配不同螢幕的距離水平方向 sizeBdLabel:function () { var htmlFont=$("html").data("dpr"); if(htmlFont =="1"){ return -20; }else if(htmlFont =="2"){ return -50; }else if(htmlFont =="3"){ return -90; } }, //地圖上文字提示資訊的位置適配不同螢幕的距離垂直方向 sizeBdLabelH:function () { var htmlFont=$("html").data("dpr"); if(htmlFont =="1"){ return -50; }else if(htmlFont =="2"){ return -90; }else if(htmlFont =="3"){ return -140; } },