高德地圖插件

• 地圖工具條插件 （AMap.ToolBar）包括縮放控件，用戶可控制縮放按鈕是用滑動滾動條還是“+/-”按鈕形式，方向鍵盤控件、自動定位控制。添加之后默認位於地圖左上角。
• 地圖鷹眼插件 （AMap.OverView）加載此插件后，會在地圖右下角顯示一個地圖簡略的概覽，用於在更廣闊的區域反映當前的地圖視口，支持用戶控制此鷹眼是打開狀態還是關閉狀態。添加之后默認位於地圖右下角。
• 地圖比例尺插件 （AMap.Scale）用於顯示地圖比例關系，添加之后默認位於地圖左下角。
• 圓編輯插件 （AMap.Circle）用於編輯AMap.Circle對象。通過該插件可以使用鼠標拖動直接修改圓的半徑，改變圓心的位置。
• 折線、多邊形編輯插件 （AMap.PolyEditor）用於編輯AMap.Polyline、AMap.Polygon對象。通過該插件可以使用鼠標將折線上的各個節點或多邊形的各個頂點調整到目標位置，在折線上新增、刪除節點或在多邊形上新增、刪除頂點，拖拽多邊形到目標位置。
• 拖拽導航插件 （AMap.DragRoute）通過鼠標拖拽已有導航路徑上的任一點，可以實現導航起點、途經點、終點的調整，系統根據調整后的起點、途經點、終點信息，實時查詢拖拽后的導航路徑並在地圖上同步顯示。
• 鼠標工具插件 (AMap.MouseTool）通過鼠標工具插件，可以開啟鼠標工具，實現鼠標畫標注點、畫線、畫多邊形、畫矩形、畫圓、測距、測面積、拉框放大、拉框縮小等功能。

AMap.ToolBar

加載工具條以及設置工具條類型

    //加載工具條插件
    mapObj.plugin(["AMap.ToolBar"],function(){
        //加載工具條
        tool = new AMap.ToolBar({
            //初始化定義配置
            direction:false,//隱藏方向導航
            ruler:false//隱藏視野級別控制尺
            //autoPosition:false//禁止自動定位
        });
        mapObj.addControl(tool);
    });

方法:

<a href="javascript:tool.showDirection()">顯示方向導航鍵盤</a>  
<a href="javascript:tool.hideDirection()">隱藏方向導航鍵盤</a>  
<a href="javascript:tool.showRuler()">顯示級別控制尺</a>  
<a href="javascript:tool.hideRuler()">隱藏級別控制尺</a>  
<a href="javascript:tool.show()">顯示工具條</a> 
<a href="javascript:tool.hide()">隱藏工具條</a>  
<a href="javascript:tool.doLocation();void(0)">位置定位</a>

 

AMap.OverView 眼鷹
加載眼鷹以及設置眼鷹類型

    mapObj.plugin(["AMap.OverView"],function(){
        //加載鷹眼
        view = new AMap.OverView({
            //visible:false //初始化隱藏鷹眼
        });
        mapObj.addControl(view);
    });

設置眼鷹

<a href="javascript:view.show()">顯示鷹眼</a>
<a href="javascript:view.hide()">隱藏鷹眼</a> 
<a href="javascript:view.open()">最大化鷹眼</a>
<a href="javascript:view.close()">最小化鷹眼</a>

 

 

 

AMap.Scale    比例尺插件

加載比例尺插件 以及設置比例尺插件 類型

 

    mapObj.plugin(["AMap.ToolBar","AMap.OverView,AMap.Scale"],function(){
        //加載比例尺
        scale = new AMap.Scale();
        mapObj.addControl(scale);
    });

 

設置比例尺

 

 

<a href="javascript:scale.show()">顯示比例尺</a> <a href="javascript:scale.hide()">隱藏比例尺</a>

 

 

 

圓編輯插件 （AMap.Circle）

加載圓編輯插件插件以及設置圓編輯插件插件類型

 

var circle = new AMap.Circle({
    map: mapObj,
    center:new AMap.LngLat("116.40332221984863","39.90025505675715"),
    radius:1000,
    strokeColor: "#F33",
    strokeOpacity: 1,
    strokeWeight: 3,
    fillColor: "ee2200",
    fillOpacity: 0.35
});
 
mapObj.plugin(["AMap.CircleEditor"],function(){
    circleEditor = new AMap.CircleEditor(mapObj,circle);
});

 

設置圓編輯插件

 

<a href="javascript:circleEditor.open()">顯示圓編輯插件</a>  <a href="javascript:circleEditor.close()">隱藏圓編輯插件</a>  

 

 

 

 

 

 

 

 

 

折線、多邊形編輯插件 AMap.PolyEditor

加載折線、多邊形編輯插件插件以及設置折線、多邊形編輯插件插件類型

 

//編輯折線  
function editLine(){
    var arr=new Array();//經緯度坐標數組
    arr.push(new AMap.LngLat("116.368904","39.913423"));
    arr.push(new AMap.LngLat("116.382122","39.901176"));
    arr.push(new AMap.LngLat("116.387271","39.912501"));
    arr.push(new AMap.LngLat("116.398258","39.904600"));
     
    //定義折線對象
    polyline=new AMap.Polyline({
        path:arr,     //設置折線的節點數組
        strokeColor:"#F00",
        strokeOpacity:0.4,
        strokeWeight:3,
        strokeStyle:"dashed",
        strokeDasharray:[10,5]
    });
     
    polyline.setMap(mapObj);//地圖上添加折線 【添加直線】
     
    //構造折線編輯對象，並開啟折線的編輯狀態
    mapObj.plugin(["AMap.PolyEditor"],function(){
        polylineEditor = new AMap.PolyEditor(mapObj,polyline);
        polylineEditor.open();
    });                                 
}

 

設置折線、多邊形編輯插件

 

<a href="javascript:circleEditor.open()">顯示折線、多邊形編輯插件</a>  <a href="javascript:circleEditor.close()">隱藏折線、多邊形編輯插件</a>