Class: Circle

Circle

圆形类,地图上圆形的绘制

const circle = new Circle({
  center: [122.144532, 29.955366],
  radius: 100,
  fill: {
    color: "blue",
    opacity: 0.3
  },
  stroke: {
    color: "yellow",
    width: 2
  }
});
const layer_ = new VectorLayer({
  name: "Circle测试",
  zIndex: 1
});
layer_.addFeature(circle);
map.addLayer(layer_);

new Circle(options)

overlay/Circle.js, line 37

构造圆形覆盖物，通过CircleOptions设置圆形

Name Type Description

options

CircleOptions

通过CircleOptions指定圆形相关样式

Name Type Description

center

Array

圆心位置

radius

Number

圆半径,单位:米

zIndex

Number

圆形的显示顺序

extData

Any

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

stroke

Object.<StrokeOptions>

轮廓线样式对象

Name	Type	Default	Description
`color`	String	"#409EFF"	optional 轮廓线颜色
`width`	Number	3	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

CustomFeature

Classes

Circle

Methods

inherited addToLayer(layer){Feature} overlay/CustomFeature.js, line 133

要素添加到指定图层

Name	Type	Description
`layer`	VectorLayer	要素要添加的图层

Returns:

Type	Description
Feature	当前overlay要素对象

getBounds(){Array} overlay/Circle.js, line 156

获取Circle的外接矩形坐标

Returns:

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

getCenter(){Array} overlay/Circle.js, line 111

获取圆形的圆心位置

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

getFirstCoordinate(){Array} overlay/Circle.js, line 165

获取Circle边界坐标的第一个坐标

Returns:

Type	Description
Array	经纬度坐标

getLastCoordinate(){Array} overlay/Circle.js, line 174

获取Circle边界坐标的最后一个坐标

Returns:

Type	Description
Array	经纬度坐标

getRadius(){Number} overlay/Circle.js, line 138

获取圆形的半径

Returns:

Type	Description
Number	圆形的半径(m)

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/Circle.js, line 95

设置圆形的圆心位置

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对象

inherited setFill(fillOptions) overlay/CustomFeature.js, line 194

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

Name	Type	Description
`fillOptions`	Object.<FillOptions>	要素的填充设置

setRadius(radius) overlay/Circle.js, line 120

设置圆形的半径

Name	Type	Description
`radius`	Number	圆形的半径(m)

inherited setStroke(strokeOptions) overlay/CustomFeature.js, line 222

设置要素的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 上下文环境