亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

Community

Learn

Tools Library

AI Tools

Leisure

English

javascript - A problem about obtaining latitude and longitude from Baidu Map JS API

PHPz 2017-05-19 10:14:14

930

Currently there is such a requirement: Use the mouse to click on the map to determine the vertices to delineate a polygon, and write the corresponding longitude and latitude of the polygon to the database in order. This function needs to be integrated into the website.

My idea is this: directly use Baidu Map API to display the map. The key is to obtain the longitude and latitude of the mouse point (and then cover it with a layer of p or directly use the Add Overlay API), similar to this: http:// api.map.baidu.com/lbsa... But this is a product, and what I want to use is API

Currently no such API has been found on Baidu Maps. Do you have any solutions?

PHPz

學(xué)習(xí)是最好的投資！

reply all(2)

過去多啦不再A夢2017-05-19 10:16:14 2 floor

I happened to get one before! Note that you need to go to Baidu to apply for a key yourself!

<!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"  />
  
    <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'
        }
        
        //實例化鼠標(biāo)繪制工具
        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("選取范圍的基準(zhǔn)點(diǎn)坐標(biāo)為" + JSON.stringify(handle.getPath()));
        });
    </script>
</body>
</html>

Like +0

Add Reply

為情所困2017-05-19 10:16:14 1 floor

Browsed Baidu Open Platform http://lbsyun.baidu.com/index...

Isn’t this right?

在標(biāo)準(zhǔn)的DOM事件模型中（DOM Level 2 Events），監(jiān)聽函數(shù)會得到一個事件對象e，在e中可以獲取有關(guān)該事件的信息。同時在監(jiān)聽函數(shù)中this會指向觸發(fā)該事件的DOM元素。 百度地圖API的事件模型與此類似，在事件監(jiān)聽函數(shù)中傳遞事件對象e，每個e參數(shù)至少包含事件類型（type）和觸發(fā)該事件的對象（target）。 API還保證函數(shù)內(nèi)的this指向觸發(fā)（同時也是綁定）事件的API對象。
例如，通過參數(shù)e得到點(diǎn)擊的經(jīng)緯度坐標(biāo)。
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() + "級");    
});

Like +0

Add Reply