rect.md 1.5 KB

矩形&圆角矩形

::: details 目录 [[toc]]

:::

item 实例

示例中展示了 一种渐变风格的 json 传参

"default":{
    "stroke": "#cccccc",
    "fill": "SLinearGradient{0,0;0,1000;0,#ff483bff;0.5,#04ff00ff;1,#3d4effff;}",
    "lineWidth": 2,
    "effect": {}
},
"selected": {
    "stroke": "#66ff66",
    "fill": "SRadialGradient{500,500,50;500,500,500;0,#ff483bff;0.5,#04ff00ff;1,#3d4effff;}",
    "lineWidth": 3,
    "effect": {}
},

一种普通纯色风格的 json 传参

"default":{
    "stroke": "#cccccc",
    "fill": "SLinearGradient{0,0;0,1000;0,#ff483bff;0.5,#04ff00ff;1,#3d4effff;}",
    "lineWidth": 2,
    "effect": {}
},
"selected": {
    "stroke": "#66ff66",
    "fill": "SRadialGradient{500,500,50;500,500,500;0,#ff483bff;0.5,#04ff00ff;1,#3d4effff;}",
    "lineWidth": 3,
    "effect": {}
},

::: details 查看代码使用 <<< @/docs/.vuepress/components/scene/items/rect.vue :::

item 传参注意

item 传入的圆角的半径默认是 0,即不绘制圆角; 如果传入的值是数字类型且不为0则绘制圆角;
item 传入的数据 data 大写跟随数据字典;
保存item的时候,保存类型为 String ,调用渐变类的value()方法即可返回当前渐变类的字符串;
item 状态切换及 style 内容详情参考 建筑信息图-底图风格