摘要:高德地圖入門三距離測(cè)量插件區(qū)別雖然鼠標(biāo)工具插件也提供距離量測(cè)功能,但是距離量測(cè)插件,提供更為豐富的樣式設(shè)置功能。
高德地圖 Javascript API 入門(三) 距離測(cè)量插件 區(qū)別
雖然鼠標(biāo)工具插件也提供距離量測(cè)功能,
但是距離量測(cè)插件,提供更為豐富的樣式設(shè)置功能。
JS
map.plugin(["AMap.RangingTool"],function () { var rangingTool=new AMap.RangingTool(map); rangingTool.turnOn(); // 開啟量測(cè)功能 });
預(yù)覽
樣式設(shè)置RangingToolOptions | 類型 | 說明 |
---|---|---|
startMarkerOptions |
Object |
設(shè)置量測(cè)起始點(diǎn)標(biāo)記屬性對(duì)象,包括點(diǎn)標(biāo)記樣式、大小等,參考 ??MarkerOptions ?列表 |
midMarkerOptions |
Object |
設(shè)置量測(cè)中間點(diǎn)標(biāo)記屬性對(duì)象,包括點(diǎn)標(biāo)記樣式、大小等,參考 ?MarkerOptions ?列表 |
endMarkerOptions |
Object |
設(shè)置量測(cè)結(jié)束點(diǎn)標(biāo)記屬性對(duì)象,包括點(diǎn)標(biāo)記樣式、大小等,參考 ?MarkerOptions ?列表 |
lineOptions |
Object |
設(shè)置距離量測(cè)線的屬性對(duì)象,包括線樣式、顏色等,參考 ?PolylineOptions 列表 |
tmpLineOptions |
Object |
設(shè)置距離量測(cè)過程中臨時(shí)量測(cè)線的屬性對(duì)象,包括線樣式、顏色等,參考 ?PolylineOptions ?列表 |
startLabelText |
String |
設(shè)置量測(cè)起始點(diǎn)標(biāo)簽的文字內(nèi)容,默認(rèn)為“起點(diǎn)” |
midLabelText |
String |
設(shè)置量測(cè)中間點(diǎn)處標(biāo)簽的文字內(nèi)容,默認(rèn)為當(dāng)前量測(cè)結(jié)果值 |
endLabelText |
String |
設(shè)置量測(cè)結(jié)束點(diǎn)處標(biāo)簽的文字內(nèi)容,默認(rèn)為當(dāng)前量測(cè)結(jié)果值 |
startLabelOffset |
Pixel? |
設(shè)置量測(cè)起始點(diǎn)標(biāo)簽的偏移量。默認(rèn)值:Pixel(-6, 6) |
midLabelOffset |
Pixel? |
設(shè)置量測(cè)中間點(diǎn)標(biāo)簽的偏移量。默認(rèn)值:Pixel(-6, 6) |
endLabelOffset |
Pixel? |
設(shè)置量測(cè)結(jié)束點(diǎn)標(biāo)簽的偏移量。默認(rèn)值:Pixel(-6, 6) |
map.plugin(["AMap.RangingTool"],function () { var rangingTool=new AMap.RangingTool(map,{ startLabelText:"START", midLabelText:"MID", endLabelText:"END" }); rangingTool.turnOn(); });
預(yù)覽
JS
map.plugin(["AMap.RangingTool"],function () { var rangingTool=new AMap.RangingTool(map,{ lineOptions:{ strokeColor:"#ff3300", strokeStyle:"dashed", strokeWeight:10, strokeOpacity:0.5, isOutline:true, outlineColor:"#009933", showDir:true } }); rangingTool.turnOn(); });
預(yù)覽
小練習(xí) 繪制太原市區(qū)的大概范圍JS
// 用坐標(biāo)拾取器獲得坐標(biāo) var lineArr=[ [112.490931,37.898793], [112.553588,37.898793], [112.603026,37.899877], [112.605086,37.855028], [112.605601,37.831169], [112.610236,37.824661], [112.610236,37.798487], [112.602683,37.793739], [112.499171,37.793739], [112.495051,37.794553], [112.500544,37.830762], [112.500716,37.843099], [112.48973,37.847301], [112.489901,37.896897], [112.492476,37.8992] ]; // 實(shí)例化一個(gè)Polyline類 var polyline=new AMap.Polyline({ path:lineArr, strokeColor:"#ff2200", strokeWeight:5 }); // 添加到地圖中 polyline.setMap(map);
預(yù)覽
參考來源:http://lbs.amap.com/
作者:Yangfan
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/81679.html
摘要:高德地圖入門一準(zhǔn)備工作首先注冊(cè)個(gè)開發(fā)者賬號(hào)然后創(chuàng)建應(yīng)用,獲取新建文件,在標(biāo)簽中引入如下代碼把你的值填入即可您申請(qǐng)的值創(chuàng)建設(shè)置地圖容器地圖初始化創(chuàng)建地圖設(shè)置地圖參數(shù)可以通過以下設(shè)置也可通過對(duì)象的方法設(shè)置預(yù)覽個(gè)性化地圖改變地圖樣式目前支持五種地 高德地圖 Javascript API 入門(一) 準(zhǔn)備工作 首先注冊(cè)個(gè)開發(fā)者賬號(hào) showImg(https://segmentfault.co...
摘要:鼠標(biāo)在地圖上拉框即可繪制相應(yīng)的矩形。鼠標(biāo)在地圖上單擊繪制量測(cè)區(qū)域,鼠標(biāo)左鍵雙擊或右鍵單擊結(jié)束當(dāng)前量測(cè)操作,并顯示本次量測(cè)結(jié)果。參數(shù)設(shè)為時(shí),鼠標(biāo)操作關(guān)閉的同時(shí)清除地圖上繪制的所有覆蓋物對(duì)象設(shè)為時(shí),保留所繪制的覆蓋物對(duì)象。 高德地圖 Javascript API 入門(二) 鼠標(biāo)工具插件 測(cè)量距離 JS map.plugin([AMap.MouseTool],function ()...
摘要:高德地圖入門七熱力圖插件簡單例子顯示地圖坐標(biāo)點(diǎn)加載熱力圖插件預(yù)覽參數(shù)構(gòu)造函數(shù)說明構(gòu)造一個(gè)熱力圖插件對(duì)象,為要疊加熱力圖的地圖對(duì)象,屬性參考列表中的說明。 高德地圖 Javascript API 入門(七) 熱力圖插件 簡單例子 // 顯示地圖 var map=new AMap.Map(container,{ resizeEnable:true, center:[116....
摘要:高德地圖入門六出行規(guī)劃公交路徑公交換乘服務(wù),提供起終點(diǎn)公交路線規(guī)劃服務(wù),整合步行方式初始化加載公交線路插件實(shí)例化北京必須值,搭乘公交所在城市可選值,搜索結(jié)果的標(biāo)注線路等均會(huì)自動(dòng)添加到此地圖上可選值,顯示搜索列表的容器可選值,詳細(xì)信息駕駛策略 高德地圖 Javascript API 入門(六) 出行規(guī)劃 公交路徑 公交換乘服務(wù),提供起、終點(diǎn)公交路線規(guī)劃服務(wù),整合步行方式 初始化 // 加...
摘要:高德地圖入門四地圖覆蓋物覆蓋物類名說明是否插件點(diǎn)標(biāo)記否覆蓋物點(diǎn)標(biāo)記復(fù)雜點(diǎn)標(biāo)記對(duì)象,對(duì)普通點(diǎn)標(biāo)記的擴(kuò)展否覆蓋物折線否覆蓋物多邊形否覆蓋物圓否圖片覆蓋物否地圖右鍵菜單否點(diǎn)標(biāo)記預(yù)覽自定義點(diǎn)標(biāo)記預(yù)覽多邊形預(yù)覽右鍵菜單添加右鍵菜單內(nèi)容項(xiàng)放大縮小添加 高德地圖 Javascript API 入門(四) 地圖覆蓋物 覆蓋物 類名 說明 是否插件 AMap.Marker 點(diǎn)標(biāo)記 否 AM...
閱讀 2945·2021-09-22 15:20
閱讀 3029·2021-09-22 15:19
閱讀 3579·2021-09-22 15:15
閱讀 2493·2021-09-08 09:35
閱讀 2434·2019-08-30 15:44
閱讀 3076·2019-08-30 10:50
閱讀 3868·2019-08-29 16:25
閱讀 1658·2019-08-26 13:55