Skip to content

Latest commit

 

History

History
62 lines (54 loc) · 3.24 KB

元素.md

File metadata and controls

62 lines (54 loc) · 3.24 KB

支持的元素

[TOC]

基础属性

属性 说明 类型 备注
x 元素左上角距离左侧距离.如果是group内,则是距离group左侧距离 number
y 元素左上角距离顶部距离.如果是group内,则是距离group顶部距离 number
width 元素宽度 number
height 元素高度 number
rotation 元素旋转 number
lineCap 线段末端属性 string 参照canvas 对应属性
lineDash 一组值来指定描述模式的线和间隙的交替长度 array 参照canvas 对应属性
lineDashOffset 虚线偏移量的属性 number 参照canvas 对应属性
linearGradient 渐变点起始坐标 [x1,y1,x2,y2] 参照canvas 对应属性
colors 填充颜色 [[0,'#CCC'],[0.2,'#AAA'],[1,'#AAA']] 参照 cavas addColorStop
strokeStyle 边框颜色 #FFFFFF 参照canvas 对应属性
lineWidth 边框宽度 1 参照canvas 对应属性
fillStyle 填充颜色 #FFFFFF 参照canvas 对应属性
pin 固定位置(如果你有元素放在了动态文本的下方,又不希望元素位置被移动,可以设置该属性为true) boolean

group(组)关于Group说明

属性 说明
url 要给group设置的背景图片 (需要先设置width和height)
fillStyle 要给group设置的背景色(需要先设置width和height)

text (文字)

属性 说明 类型 示例
height 一般不需要设置,当文本为动态内容时可设置为'auto' string 'auto'
orientation 文字方向(横排,竖排) ‘horizontal’ 或 ‘vertical’ 默认‘horizontal’
maxWidth 最大宽度(设置后会自动换行,需要和lineHeight配合使用) number
lineHeight 行高 number
maxLine 最大行数,超出则显示... number
shadow 阴影 object:{color,offsetY,offsetYblur}

image (图片)

属性 说明 类型
url 图片链接 string
isCircular 是否圆形 boolean
r 圆角 number

circle(圆)

属性 说明 类型 示例
r 半径 number 20
angle 角度 number(0~360) 如果你需要画一个圆形进度条,可以使用这个
sAngle 开始角度 同上 调整圆弧的开始角度(canvas默认开始角度时3点钟方向)

rect (矩形)

属性 说明 示例 备注
r 圆角矩形 number
rt,rb,lt,lb 右上,右下,左上,左下 boolean 单独控制四个角是否圆角

line (线)

属性 说明 示例 备注
long 线长度 number