目前有這樣一個需求: 在地圖上用滑鼠點擊確定頂點的方式劃定一個多邊形,並且將多邊形的對應的經緯度按順序寫入資料庫,這個功能需要集成到網站中。
我思路是這樣的:直接用百度地圖API展示地圖,關鍵是要獲取滑鼠所在點的經緯度(然後再蒙上一層p或者直接用添加覆蓋物API),類似這樣:http:// api.map.baidu.com/lbsa... 但這是一個產品,而我要使用的是API
目前沒有在百度地圖發現這樣的API,不知道各位朋友有沒有什麼解決方案?
学习是最好的投资！
<!DOCTYPE html> <html> <head> <style type="text/css"> body, html{width: 100%;height: 100%;margin:0;} #allmap {width: 100%; height:100%; overflow: hidden;} </style> <script type="text/javascript" src="http://api.map.baidu.com/getscript?v=2.0&ak=换成你的密钥"></script> <script type="text/javascript" src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script> <link rel="stylesheet" href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" /> <title>test</title> </head> <body> <p id="allmap"> <p id="map" style="width:100%;height:100%;"></p> </p> <script> var map = new BMap.Map('map', {enableMapClick:false}); var poi = new BMap.Point(116.404, 39.915); map.centerAndZoom(poi, 11); map.enableScrollWheelZoom(); var styleOptions = { strokeColor:"red", fillColor:"", strokeWeight: 1, strokeOpacity: 0.8, fillOpacity: 0.6, strokeStyle: 'dashed' } //实例化鼠标绘制工具 var drawingManager = new BMapLib.DrawingManager(map, { isOpen: false, enableDrawingTool: true, drawingToolOptions: { anchor: BMAP_ANCHOR_TOP_RIGHT, offset: new BMap.Size(5, 5), drawingModes :[ BMAP_DRAWING_RECTANGLE ] }, rectangleOptions: styleOptions }); drawingManager.addEventListener('overlaycomplete', function(e){ var overlay = e.overlay, handle; handle = new BMap.Polygon(overlay.getPath(), {strokeWeight: 2, strokeColor: "#ff0000"}); map.addOverlay(handle); alert("选取范围的基准点坐标为" + JSON.stringify(handle.getPath())); }); </script> </body> </html>
翻了下百度開放平台 http://lbsyun.baidu.com/index...
這個不是麼？
在标准的DOM事件模型中（DOM Level 2 Events），监听函数会得到一个事件对象e，在e中可以获取有关该事件的信息。同时在监听函数中this会指向触发该事件的DOM元素。 百度地图API的事件模型与此类似，在事件监听函数中传递事件对象e，每个e参数至少包含事件类型（type）和触发该事件的对象（target）。 API还保证函数内的this指向触发（同时也是绑定）事件的API对象。 例如，通过参数e得到点击的经纬度坐标。 var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); map.addEventListener("click", function(e){ alert(e.point.lng + ", " + e.point.lat); }); 或者通过this得到地图缩放后的级别。 var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); map.addEventListener("zoomend", function(){ alert("地图缩放至：" + this.getZoom() + "级"); });
剛好以前弄過一個！注意需要你自己去baidu申請一個密鑰！
翻了下百度開放平台 http://lbsyun.baidu.com/index...
這個不是麼？