javascript – Ein Problem beim Abrufen von Breiten- und Längengraden von der Baidu Map JS API
PHPz
PHPz 2017-05-19 10:14:14
0
2
788

Es gibt derzeit eine solche Anforderung: Klicken Sie mit der Maus auf die Karte, um die Eckpunkte zu bestimmen, um ein Polygon abzugrenzen, und schreiben Sie den entsprechenden Längen- und Breitengrad des Polygons in die Datenbank. Diese Funktion muss in die Website integriert werden .

Meine Idee ist folgende: Verwenden Sie direkt die Baidu-Karten-API, um die Karte anzuzeigen. Der Schlüssel besteht darin, den Längen- und Breitengrad des Mauspunkts zu ermitteln (und ihn dann mit einer p-Ebene abzudecken oder direkt die Add Overlay-API zu verwenden), ähnlich wie Dies: http://api.map.baidu.com/lbsa... Aber das ist ein Produkt und was ich verwenden möchte, ist die API

Es gibt derzeit keine solche API auf Baidu Maps. Haben Sie irgendwelche Lösungen?

PHPz
PHPz

学习是最好的投资!

Antworte allen(2)
过去多啦不再A梦

刚好以前弄过一个!注意需要你自己去baidu申请一个密钥!

<!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() + "级");    
});
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage