页面树结构

版本比较

标识

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

(此文档仅供参考)

...

需求1:

 在做自助仪表盘的时候有时需要制作一些指标组件,如下截图:

 

...

解决方案1:

可以用油量图去制作这些指标组件,操作步骤如下:

1.先创建油量图,如下截图

...

3.设置组件样式,把指针隐藏掉以及设置标题栏样式

  

  

 最终此油量图组件效果:

 


需求2:

 需要有logo,需要动态传参,点击可以跳转打开别的报表,及对应简单样式(需将表头显示在下,数据值显示在上)的设置等。(注:需求是基于V95场景做的)

解决方案2:

此类型考虑到动态传参的场景,所以使用文本组件在此场景中是不适用的。

1、考虑使用油量图,无盘油量图的方式。随机托选图形组件到编辑区域,右上方“智能配图”选择 “油量图”。

image2022-1-28_15-50-44.pngImage Added

2、标记区域选择 “无盘油量图”

image2022-1-28_15-51-55.pngImage Added

3、添加字段,选择需要显示的指标数据。

image2022-1-28_15-53-20.pngImage Added

 4、按照需求样式,简单配置,或写扩展属性。

image2022-1-28_15-56-47.pngImage Added

自定义属性,写扩展属性实现【表头显示在下,数据值显示在上】,其中"offsetCenter": [0,"-50%"]  为距离中心偏移量的设置,可对应调整数据观察效果。注:相关属性了解设置可自行百度搜索相关文档做参考。

参考的扩展属性如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

{
    "textStyle": {
        "fontFamily": "Microsoft YaHei",
        "fontWeight": "normal",
        "fontSize": 20,
        "color": "red",
        "fontStyle": "normal",
        "textDecoration": "none",
        "offsetCenter": [
            0,
            "-50%"
        ]
    },
    "series": [
        {
            "title": {
                "color": "blue",
                "offsetCenter": [
                    0,
                    "50%"
                ]
            }
        }
    ]
}


5、设置跳转规则,点击数据值,动态传参打开别的报表明细。

image2022-1-28_16-1-22.pngImage Added

可按照跳转需求,配置跳转场景。

image2022-1-28_16-1-58.pngImage Added


Viewtracker