1.最近項目開發中,用到了地圖,需求是使用百度地圖java
初始化地圖:ide
var list = ""; var map = ""; var drawingManager = ""; if (typeof (BMap) == 'undefined') { //地圖加載失敗 document.getElementById("allmap").innerHTML = "地圖加載失敗"; } else { /** 百度地圖API功能 **/ map = new BMap.Map("allmap"); var point = ""; var xpointer = document.getElementById("mxpoint").value; var ypointer = document.getElementById("mypoint").value; if (xpointer != null) { point = new BMap.Point(xpointer, ypointer); } else { point = new BMap.Point(116.404, 39.915); // 建立點座標 } map.centerAndZoom(point, 15); // 初始化地圖,設置中心點座標和地圖級別。 map.enableScrollWheelZoom(); //啓用滾輪放大縮小 map.addControl(new BMap.NavigationControl()); // 添加平移縮放控件 map.addControl(new BMap.ScaleControl()); // 添加比例尺控件 window.clickPointer = "tuodong"; circle(); }
2.項目需求是每隔30秒獲取當前在線打開GPS的用戶post
function showTimer() { var data = {}; var url_validate = $ctx + "/ddtinfo/ddtinfo!validateMapUser.action"; App.post(url_validate, data, function(response) { map.clearOverlays(); if (clickPointer == "huayuan") { circle(); } var err = App.err(response); if (err) { alert(err.message); } else { list = new Array(); $.each(response || [], function(i, o) { list[i] = o; var pt = new BMap.Point(o.xpoint, o.ypoint); var imgstr = $ctx + "/images/blue.png"; var myIcon = new BMap.Icon(imgstr, new BMap.Size(38, 47)); var marker = new BMap.Marker(pt, { icon : myIcon }); if(leftMapUserId != undefined){ if(leftMapUserId == o.yonghuid){ marker.setTop(true,27000000); } } map.addOverlay(marker); var myLabel = new BMap.Label(o.yonghuname, { offset : new BMap.Size(-10, -25) }); myLabel.setStyle({ "color" : "white", //顏色 "fontSize" : "12px", //字號 "border" : "0", //邊 "background" : "#00CCFF", //背景顏色 "textAlign" : "center", //文字水平居中顯示 "lineHeight" : "20px", //行高,文字垂直居中顯示 "width" : "50px", "border-radius" : "5px" //圓角 }); marker.setLabel(myLabel); marker.addEventListener("click", function() { var yonghuid = o.yonghuid; var yonghuname = o.yonghuname.replace(/[ ]/g, ""); var mrzuname = o.morenzuname; var morenzuid = o.morenzuid; showDiv(yonghuid, yonghuname, morenzuid, mrzuname, this); }); }) } }); setTimeout("showTimer()", 30000); }
3.點擊標註動態顯示信息窗口,在網上看到不少人,提問爲何百度地圖點擊標註顯示的都是最後那我的的信息,使用下面方法okui
function showDiv(yonghuid, yonghuname, morenzuid, mrzuname, marker) { var content = '<div style="margin:0;font-size:14px;line-height:26px;padding:2px;">' + '<span style="font-size:12px;color:#71787F">' + mrzuname + '</span><br/>' + ' <img class="mtell" title="單呼" yhname=' + yonghuname + ' yhongId=' + yonghuid + ' morenzuid=' + morenzuid + ' src="../images/tel.png" style="cursor:pointer" onClick="tell(' + morenzuid + ',' + yonghuid + ',this)" alt=""/> ' + '<img src="../images/message.png" style="cursor:pointer" title="消息"onClick="message(' + '\'' + yonghuname + '\'' + ',' + yonghuid + ')" alt=""/> ' + '<img src="../images/task.png" style="cursor:pointer" title="任務" onClick="task(' + '\'' + yonghuname + '\'' + ',' + yonghuid + ')" alt=""/> ' + '<img src="../images/shipin.png" style="cursor:pointer" title="視頻" onClick="voide(' + '\'' + yonghuname + '\'' + ',' + yonghuid + ')" alt=""/>' + '</div>'; var infoWindow1 = new BMap.InfoWindow(content, { enableMessage : false, width : 130, height : 88, title : yonghuname.toString() + "(" + yonghuid.toString() + ")" }); marker.openInfoWindow(infoWindow1); }