Class: CircleMarker

CircleMarker

圆点标记，属性和方法于Circle大体一致， 区别为CircleMarker不随着地图级别变化发生大小改变，radius的单位为px.

const circleMarker = new CircleMarker({
  center: [122.143839, 29.954603],
  radius: 7,
  fill: {
    color: "blue",
    opacity: 1
  },
  stroke: {
    color: "yellow",
    width: 2
  }
});
const layer_ = new VectorLayer({
  name: "CircleMarker测试",
  zIndex: 1
});
layer_.addFeature(circleMarker);
map.addLayer(layer_);

new CircleMarker(options)

overlay/CircleMarker.js, line 40

构造圆点覆盖物，通过CircleMarkerOptions设置圆点

Name Type Description
options CircleMarkerOptions

通过CircleMarkerOptions指定圆点相关样式

Name Type Default Description
center Array

圆心位置
radius Number 7 optional

圆半径,单位:px
zIndex Number

圆点的显示顺序
extData Any

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

轮廓线样式对象

Name Type Default Description
color String "#409EFF" optional

轮廓线颜色
width Number 2 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
fill Object.<FillOptions>

圆点填充样式对象

Name Type Default Description
color String "#B269F9" optional

圆点填充颜色
opacity Number 0.7 optional

圆点填充透明度，取值范围[0,1], 0表示完全透明,1表示不透明.

Extends

Classes

CircleMarker

Methods

inherited addToLayer(layer){Feature}

overlay/CustomFeature.js, line 133

要素添加到指定图层

Name Type Description
layer VectorLayer

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

getCenter(){Array}

overlay/CircleMarker.js, line 228

获取圆点的圆心位置

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要素的填充设置

getRadius(){Number}

overlay/CircleMarker.js, line 203

获取圆点的半径

Returns:
Type Description
Number 圆点的半径(px)

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 返回事件类型以及回调函数

setCenter(center)

overlay/CircleMarker.js, line 212

设置圆点的圆心位置

Name Type Description
center Array

圆点的圆心位置

inherited setExtData(extData)

overlay/CustomFeature.js, line 146

给要素绑定额外数据

Name Type Description
extData Any

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

setFill(fillOptions)

overlay/CircleMarker.js, line 133

设置圆点标记的填充颜色,可以设置fill里面的单个属性

Name Type Description
fillOptions Object.<FillOptions>

圆点标记的填充设置

setRadius(radius)

overlay/CircleMarker.js, line 183

设置圆点的半径

Name Type Description
radius Number

圆点的半径(px)

setStroke(strokeOptions)

overlay/CircleMarker.js, line 158

设置圆点标记的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

上下文环境