上圖效果JS代碼示例：
<script type="text/javascript">
// 創(chuàng)建Map實例
var map = new BMap.Map("allmap", {enableMapClick:false});
// 設(shè)置地圖背景色為白色
map.getContainer().style.background = '#FFF';
var point = new BMap.Point(104.074362,30.540276);
map.centerAndZoom(point, 5);
var vectorFCArrow = new BMap.Marker(new BMap.Point(point.lng-0.01,point.lat), {
// 初始化方向向上的閉合箭頭
icon: new BMap.Symbol(BMap_Symbol_SHAPE_FORWARD_CLOSED_ARROW, {
scale: 5,
strokeWeight: 1,
rotation: 90,//順時針旋轉(zhuǎn)90度
fillColor: 'red',
fillOpacity: 0.5
})
});
map.addOverlay(vectorFCArrow);
// 隱藏方法
function hide(){
vectorFCArrow.hide();
}
// 顯示方法
function show(){
vectorFCArrow.show();
}
</script>
類參考
Symbol
此類表示通過svg的path string創(chuàng)建的矢量圖標(biāo)類。
| 構(gòu)造函數(shù) | 描述 |
| Symbol(path: String | SymboShapeType, opts: SymbolOptions) | 創(chuàng)建一個矢量圖標(biāo)實例。path為svg中的path字符串或者已定義的符號常量,opts為矢量圖標(biāo)的樣式 |
| 方法 | 返回值 | 描述 |
| setPath(path: string | SymbolShape) | none | 設(shè)置矢量圖標(biāo)的路徑 |
| setAnchor(anchor: Size) | none | 設(shè)置矢量圖標(biāo)的定位點,該定位點的位置以圖標(biāo)自身為基準(zhǔn) |
| setRotation(rotation: number) | none | 設(shè)置矢量圖標(biāo)的旋轉(zhuǎn)角度,參數(shù)為角度 |
| setScale(scale: number) | none | 設(shè)置矢量圖標(biāo)的縮放比例 |
| setStrokeWeight(strokeWeight: number) | none | 設(shè)置矢量圖標(biāo)的線寬 |
| setStrokeColor(color: string) | none | 設(shè)置矢量圖標(biāo)的線填充顏色,支持顏色常量字符串、十六進制、RGB、RGBA等格式 |
| setStrokeOpacity(opacity: number) | none | 設(shè)置矢量圖標(biāo)線的透明度,opacity范圍0~1 |
| setFillOpacity(opacity: number) | none | 設(shè)置矢量圖標(biāo)填充透明度,opacity范圍0~1 |
| setFillColor(color: string) | none | 設(shè)置矢量圖標(biāo)的填充顏色。支持顏色常量字符串、十六進制、RGB、RGBA等格式 |
SymbolOptions
此類表示Symbol構(gòu)造函數(shù)的可選參數(shù)。它沒有構(gòu)造函數(shù)，但可通過對象字面量形式表示。
| 屬性 | 類型 | 描述 |
| anchor | Size | 符號的位置偏移值 |
| fillColor | string | 設(shè)置矢量圖標(biāo)的填充顏色。支持顏色常量字符串、十六進制、RGB、RGBA等格式 |
| fillOpacity | Number | 設(shè)置矢量圖標(biāo)填充透明度,范圍0~1 |
| scale | Number | 設(shè)置矢量圖標(biāo)的縮放比例 |
| rotation | Number | 設(shè)置矢量圖標(biāo)的旋轉(zhuǎn)角度,參數(shù)為角度 |
| strokeColor | string | 設(shè)置矢量圖標(biāo)的線填充顏色,支持顏色常量字符串、十六進制、RGB、RGBA等格式 |
| strokeOpacity | Number | 設(shè)置矢量圖標(biāo)線的透明度,opacity范圍0~1 |
| strokeWeight | Number | 旋設(shè)置線寬。如果此屬性沒有指定，則線寬跟scale數(shù)值相同 |
SymbolShapeType
此枚舉類型表示矢量圖標(biāo)類預(yù)設(shè)的圖標(biāo)樣式。
| 常量 | 描述 |
| BMap_Symbol_SHAPE_CIRCLE | 圓形，默認(rèn)半徑為1px |
| BMap_Symbol_SHAPE_RECTANGLE | 矩形，默認(rèn)寬度4px、高度2px |
| BMap_Symbol_SHAPE_RHOMBUS | 菱形，默認(rèn)外接圓半徑10px |
| BMap_Symbol_SHAPE_STAR | 五角星，五角星外接圓半徑為10px |
| BMap_Symbol_SHAPE_BACKWARD_CLOSED_ARROW | 箭頭方向向下的閉合箭頭 |
| BMap_Symbol_SHAPE_FORWARD_CLOSED_ARROW | 箭頭方向向上的閉合箭頭 |
| BMap_Symbol_SHAPE_BACKWARD_OPEN_ARROW | 箭頭方向向下的非閉合箭頭 |
| BMap_Symbol_SHAPE_FORWARD_OPEN_ARROW | 箭頭方向向上的非閉合箭頭 |
| BMap_Symbol_SHAPE_POINT | 定位點圖標(biāo) |
| BMap_Symbol_SHAPE_PLANE | 預(yù)設(shè)的飛機形狀 |
| BMap_Symbol_SHAPE_CAMERA | 預(yù)設(shè)的照相機形狀 |
| BMap_Symbol_SHAPE_WARNING | 預(yù)設(shè)的警告符號 |
| BMap_Symbol_SHAPE_SMILE | 預(yù)設(shè)的笑臉形狀 |
| BMap_Symbol_SHAPE_CLOCK | 預(yù)設(shè)的鐘表形狀 |