跳到主要内容

RegularPolygon

new Konva.RegularPolygon(config)

RegularPolygon 构造函数。示例包括三角形、正方形、五边形、六边形等

参数

名称类型描述
configObject
cornerRadius (可选)Number
sidesNumber
radiusNumber
fill (可选)String填充颜色
fillPatternImage (可选)Image填充图案图像
fillPatternX (可选)Number
fillPatternY (可选)Number
fillPatternOffset (可选)Object包含 x 和 y 分量的对象
fillPatternOffsetX (可选)Number
fillPatternOffsetY (可选)Number
fillPatternScale (可选)Object包含 x 和 y 分量的对象
fillPatternScaleX (可选)Number
fillPatternScaleY (可选)Number
fillPatternRotation (可选)Number
fillPatternRepeat (可选)String可以是 "repeat"、"repeat-x"、"repeat-y" 或 "no-repeat"。默认值为 "no-repeat"
fillLinearGradientStartPoint (可选)Object包含 x 和 y 分量的对象
fillLinearGradientStartPointX (可选)Number
fillLinearGradientStartPointY (可选)Number
fillLinearGradientEndPoint (可选)Object包含 x 和 y 分量的对象
fillLinearGradientEndPointX (可选)Number
fillLinearGradientEndPointY (可选)Number
fillLinearGradientColorStops (可选)Array颜色停止点数组
fillRadialGradientStartPoint (可选)Object包含 x 和 y 分量的对象
fillRadialGradientStartPointX (可选)Number
fillRadialGradientStartPointY (可选)Number
fillRadialGradientEndPoint (可选)Object包含 x 和 y 分量的对象
fillRadialGradientEndPointX (可选)Number
fillRadialGradientEndPointY (可选)Number
fillRadialGradientStartRadius (可选)Number
fillRadialGradientEndRadius (可选)Number
fillRadialGradientColorStops (可选)Array颜色停止点数组
fillEnabled (可选)Boolean启用或禁用填充的标志。默认值为 true
fillPriority (可选)String可以是 color、linear-gradient、radial-graident 或 pattern。默认值为 color。fillPriority 属性可以非常方便地在不同填充类型之间切换。例如,如果要在填充颜色样式和填充图案样式之间切换,只需设置 fill 属性和 fillPattern 属性,然后使用 setFillPriority('color') 以颜色填充渲染形状,或使用 setFillPriority('pattern') 以填充图案配置渲染形状
stroke (可选)String描边颜色
strokeWidth (可选)Number描边宽度
fillAfterStrokeEnabled (可选)Boolean是否在描边后绘制填充?默认值为 false
hitStrokeWidth (可选)Number命中画布上的描边大小。默认值为 "auto",等于 strokeWidth
strokeHitEnabled (可选)Boolean启用或禁用描边命中区域的标志。默认值为 true
perfectDrawEnabled (可选)Boolean启用或禁用使用缓冲画布的标志。默认值为 true
shadowForStrokeEnabled (可选)Boolean启用或禁用描边阴影的标志。默认值为 true
strokeScaleEnabled (可选)Boolean启用或禁用描边缩放的标志。默认值为 true
strokeEnabled (可选)Boolean启用或禁用描边的标志。默认值为 true
lineJoin (可选)String可以是 miter、round 或 bevel。默认值为 miter
lineCap (可选)String可以是 butt、round 或 square。默认值为 butt
shadowColor (可选)String
shadowBlur (可选)Number
shadowOffset (可选)Object包含 x 和 y 分量的对象
shadowOffsetX (可选)Number
shadowOffsetY (可选)Number
shadowOpacity (可选)Number阴影不透明度。可以是 0 到 1 之间的任意实数
shadowEnabled (可选)Boolean启用或禁用阴影的标志。默认值为 true
dash (可选)Array
dashEnabled (可选)Boolean启用或禁用 dashArray 的标志。默认值为 true
x (可选)Number
y (可选)Number
width (可选)Number
height (可选)Number
visible (可选)Boolean
listening (可选)Boolean节点是否监听事件
id (可选)String唯一 ID
name (可选)String非唯一名称
opacity (可选)Number确定节点不透明度。可以是 0 到 1 之间的任意数值
scale (可选)Object设置缩放
scaleX (可选)Number设置 x 缩放
scaleY (可选)Number设置 y 缩放
rotation (可选)Number以度为单位的旋转角度
offset (可选)Object相对于中心点和旋转点的偏移
offsetX (可选)Number设置 x 偏移
offsetY (可选)Number设置 y 偏移
draggable (可选)Boolean使节点可拖动。当舞台可拖动时,可以通过拖动舞台的任意部分来拖放整个舞台
dragDistance (可选)Number
dragBoundFunc (可选)function

继承自: Konva.Shape

自有方法

radius(radius)

获取/设置半径

参数:

  • radius (Number)

返回值: Number

示例:

// get radius
var radius = shape.radius();

// set radius
shape.radius(10);

sides(sides)

获取/设置边数

参数:

  • sides (Number)

返回值: Number

示例:

// get sides
var sides = shape.sides();

// set sides
shape.sides(10);

cornerRadius(cornerRadius)

获取/设置圆角半径

参数:

  • cornerRadius (Number)

返回值: Number

示例:

// get corner radius
var cornerRadius = poly.cornerRadius();

// set corner radius
poly.cornerRadius(10);

// set different corner radius values (pentagon)
poly.cornerRadius([0, 10, 20, 30, 40]);

继承的方法

Konva.RegularPolygon 还拥有其父类的所有方法。下面的每个链接都会打开定义该方法的类中对应方法的完整文档。

来自 Konva.Shape

来自 Konva.Node