Class: Polygon

Polygon

多边形类,地图上多边形的绘制

const polygon = new Polygon({
  path: [
    [
      [122.13919401168825, 29.95346188545227],
      [122.14324951171876, 29.953826665878296],
      [122.144193649292, 29.951080083847046],
      [122.14142560958864, 29.94974970817566],
      [122.1397089958191, 29.95097279548645]
    ]
  ],
  fill: {
    color: "blue",
    opacity: 0.3
  },
  stroke: {
    color: "yellow",
    width: 2,
    lineDash: [10, 10]
  }
});
const layer_ = new VectorLayer({
  name: "Polygon测试",
  zIndex: 1
});
layer_.addFeature(polygon);
map.addLayer(layer_);

new Polygon(options)

overlay/Polygon.js, line 45

构造多边形对象，通过PolygonOptions指定折线样式

Name Type Description
options PolygonOptions

通过PolygonOptions指定多边形相关样式

Name Type Description
path Array

多边形轮廓线的节点坐标数组，当为“环”多边形时 （多边形区域在多边形内显示为“岛”），path为二维数组，数组元素为多边形轮廓线的节点坐标数组; “环”多边形时，要求数组第一个元素为外多边形，其余为“岛”多边形，外多边形需包含“岛”多边形，否则程序不作处理
zIndex Number

多边形的显示顺序
extData Any

用户自定义属性，支持JavaScript API任意数据类型， 如polygon的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

Classes

Polygon

Methods

inherited addToLayer(layer){Feature}

overlay/CustomFeature.js, line 133

要素添加到指定图层

Name Type Description
layer VectorLayer

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

getArea(){Number}

overlay/Polygon.js, line 122

获取Polygon面积

Returns:
Type Description
Number 面积(K㎡)

getBounds(){Array}

overlay/Polygon.js, line 140

获取polygon的外接矩形坐标

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

getCenter(){Array}

overlay/Polygon.js, line 149

获取多边形的几何中心

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

getPath(){Array}

overlay/Polygon.js, line 113

获取polygon轮廓线的节点坐标数组

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>

要素的填充设置

setPath(path)

overlay/Polygon.js, line 97

设置polygon的坐标串

Name Type Description
path Array

多边形轮廓线的节点坐标数组

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

上下文环境