百度地圖添加標注,並獲取標注的經緯度


1.功能介紹:地圖剛加載完的時候顯示一個默認的范圍,本例子顯示的是河南省,右鍵點擊,刪除地圖上所有的標注並添加標注,並獲取新標注的經緯度,也可以通過搜索地址,查詢大概范圍。(詳情看代碼中的注釋)

 

<h2>Index</h2>
<!--百度地圖顯示的地方-->
<div style="width: 697px; height: 462px;" id="container">
</div>
<!--百度地圖顯示的地方-->
<script src="/Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>

<script type="text/javascript">
    var map = new BMap.Map("container");//在指定的容器內創建地圖實例
    map.setDefaultCursor("crosshair");//設置地圖默認的鼠標指針樣式
    map.enableScrollWheelZoom();//啟用滾輪放大縮小,默認禁用。
    //根據經緯度選擇默認范圍
    //map.centerAndZoom(new BMap.Point(116.124878, 24.309178), 13);
    map.centerAndZoom("河南省", 8);//默認地圖的顯示范圍
    map.addControl(new BMap.NavigationControl());

    map.addEventListener("rightclick", function (e) {//地圖右鍵單擊事件,左鍵為click
        map.clearOverlays();//添加標注前清空以前的所有標注
        document.getElementById("txtjingweidu").value = e.point.lng + ", " + e.point.lat;

        var marker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat));        // 創建標注     
        map.addOverlay(marker);
    });

    function sear(result) {//根據地質搜索范圍
        var local = new BMap.LocalSearch(map, {
            renderOptions: { map: map }
        });
        local.search(result);
    }
</script>
<input id="txtAddress" type="text" />
<input id="butSearch" type="button" onclick="sear(document.getElementById('txtAddress').value)" value="搜索"/>
經緯度:
<input id="txtjingweidu" type="text" />

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM