Class: ArrowLine

ArrowLine

箭头线类,地图上箭头线的绘制

const arrowLine = new ArrowLine({
  path: [
    [122.139398, 29.954814],
    [122.142788, 29.956638],
    [122.147294, 29.956208],
    [122.146994, 29.952325]
  ],
  stroke: {
    color: "yellow",
    width: 8
  }
});
const layer_ = new VectorLayer({
  name: "ArrowLine测试",
  zIndex: 1
});
map.addLayer(layer_);
arrowLine.addToLayer(layer_);

new ArrowLine(options)

overlay/ArrowLine.js, line 53

构造箭头线对象

Name Type Description
options PolylineOptions

指定箭头线样式

Name Type Description
path Array

箭头线的节点坐标数组 [[lng,lat],[lng1,lat1],...]
zIndex Number

箭头线的显示顺序
extData Any

用户自定义属性，支持JavaScript API任意数据类型， 如Marker的id等 地图容器DIV的ID值或者DIV对象
stroke Object.<StrokeOptions>

箭头线样式对象

Name Type Default Description
color String "#1BAC2E" optional

箭头线颜色
width Number 6 optional

箭头线宽度
lineDash Array [0, 0, 0] optional

设置线为实线还是虚线, 取值：实线：[0,0,0], 虚线：[10,10] ，[10,10] 表示10个像素的实线和10个像素的空白（如此反复）组成的虚线, 点画线：[10,2,10]， [10,2,10] 表示10个像素的实线和2个像素的空白 + 10个像素的实线 和10个像素的空白 （如此反复）组成的虚线
备注

更多属性设置，参照链接： https://openlayers.org/en/latest/apidoc/module-ol_style_Stroke-Stroke.html

Extends

Classes

ArrowLine

Methods

inherited addToLayer(layer){Feature}

overlay/CustomFeature.js, line 133

要素添加到指定图层

Name Type Description
layer VectorLayer

要素要添加的图层
Returns:
Type Description
Feature 当前overlay要素对象

inherited getBounds(){Array}

overlay/Polyline.js, line 133

获取polyline的外接矩形坐标

Returns:
Type Description
Array 外接矩形的左下右上两个坐标 [xMin,yMin,xMax,yMax]

inherited getCenter(){Array}

overlay/Polyline.js, line 142

获取path坐标串的中间坐标

Returns:
Type Description
Array 经纬度坐标

inherited getExtData(){Any}

overlay/CustomFeature.js, line 157

获取要素绑定的额外数据

Returns:
Type Description
Any extData 用户自定义属性，支持JavaScript API任意数据类型， 如Circle的id等 地图容器DIV的ID值或者DIV对象

inherited getFill(){Object.<FillOptions>}

overlay/CustomFeature.js, line 213

获取要素的填充设置

Returns:
Type Description
Object.<FillOptions> fillOptions要素的填充设置

inherited getFirstCoordinate(){Array}

overlay/Polyline.js, line 115

获取path坐标串第一个坐标

Returns:
Type Description
Array 经纬度坐标

inherited getLastCoordinate(){Array}

overlay/Polyline.js, line 124

获取path坐标串最后一个坐标

Returns:
Type Description
Array 经纬度坐标

inherited getLength(){Number}

overlay/Polyline.js, line 106

获取Polyline长度

Returns:
Type Description
Number 长度(km)

inherited getPath(){Array}

overlay/Polyline.js, line 97

获取的节点坐标数组

Returns:
Type Description
Array 线的节点坐标数组

inherited getStroke(){Object.<StrokeOptions>}

overlay/CustomFeature.js, line 250

获取要素的stroke样式属性

Returns:
Type Description
Object.<StrokeOptions> 要素的stroke样式属性

inherited getZIndex(){Number}

overlay/CustomFeature.js, line 185

获取要素显示顺序

Returns:
Type Description
Number zIndex要素的显示顺序

inherited on(type, callback, context){Object}

overlay/CustomFeature.js, line 88

要素监听不同类型的事件

Name Type Default Description
type String

事件类型,现暂支持:mouseover/mouseout/click/singleclick/dblclick /pointerdrag/pointermove
callback function

回调函数
context Object this optional

上下文环境
Returns:
Type Description
Object 返回事件类型以及回调函数

inherited setExtData(extData)

overlay/CustomFeature.js, line 146

给要素绑定额外数据

Name Type Description
extData Any

用户自定义属性，支持JavaScript API任意数据类型， 如Circle的id等 地图容器DIV的ID值或者DIV对象

inherited setFill(fillOptions)

overlay/CustomFeature.js, line 194

设置要素的填充颜色,当要素类有这个属性时才起作用,可以设置fill里面的单个属性

Name Type Description
fillOptions Object.<FillOptions>

要素的填充设置

inherited setPath(path)

overlay/Polyline.js, line 81

设置polyline的坐标串

Name Type Description
path Array

线的节点坐标数组

setStroke(strokeOptions)

overlay/ArrowLine.js, line 96

设置箭头线的stroke样式,可以设置stroke里面的单个属性

Name Type Description
strokeOptions Object.<StrokeOptions>

箭头线的stroke样式属性

inherited setZIndex(zIndex)

overlay/CustomFeature.js, line 166

设置要素显示顺序

Name Type Description
zIndex Number

要素的显示顺序

inherited un(type, callback, context)

overlay/CustomFeature.js, line 105

移出要素事件的监听

Name Type Default Description
type String

事件类型,现暂支持:mouseover/mouseout/click/singleclick/dblclick /pointerdrag/pointermove
callback function

回调函数
context Object this optional

上下文环境