页面树结构

版本比较

标识

  • 该行被添加。
  • 该行被删除。
  • 格式已经改变。


目录

问题描述

在组件模板资源中,有以下组件模板实现了“槽型”效果的。

资源组件模板效果图备注
柱图方框槽型柱图

Image Added


柱图带槽型柱图

Image Added


横条图刀型横条图

Image Added


横条图圆点横条图

Image Added


横条图方块型横条图

Image Added


对比柱图带槽圆矩形对比柱图

Image Added


对比柱图渐变圆角带槽对比柱图

Image Added


组合指标看板柱图告警组合指标看板其中是4个组合的组件模板。

Image Added

该组件模板是是4个组合,效果图只选取了其中之一



方框槽型柱图、带槽型柱图、





刀型横条图、圆点横条图、


方块型横条图

和方框槽型柱图很像,但是又不太一样



带槽圆矩形对比柱图

使用扩展属性

{
"series": [
{
"showBackground": true
},
{
"showBackground": true
}
]
}



渐变圆角带槽对比柱图、

使用扩展属性

{
"series": [
{
"showBackground": true,
"backgroundStyle": {
"borderRadius": [
5,
5,
5,
5
]
}
},
{
"showBackground": true,
"backgroundStyle": {
"borderRadius": [
5,
5,
5,
5
]
}
}
]
}


柱图告警组合指标看板

{
"series": [
{
"barWidth": 10,
"showBackground": true
}
]
}

解决方法

1、首先,以上的文本组件实现告警的位置,需要在文本组建中数值对应的公式外侧加上大括号作为告警的标识。注意该大括号不要随意去除。



2、将组件模板复制过来,切换成自己的数据模型、配置好字段后。如果有需要修改告警的条件,如设置告警条件为 “大于等于20%,字体红色告警;小于20%,字体绿色告警”。可按如下步骤设置

(1)选中该告警的文本组件,右键→宏管理



(2)双击宏管理界面中该组件下方的告警宏代码



(3)找到如下截图中,红框框出来的部分



(5)修改代码 “value>=XX”中的数值。



注意事项

如果最大值超出了Y轴刻度,则需要设置Y轴的最大值大于最大值