仪表板全局样式
整体概述
功能定位
通过类似“一键配置”的方式实现Quick BI仪表板视觉风格的统一管理,提升多组件/多页面样式配置效率 。
核心价值
一键式批量调整 ≥3个组件的视觉属性
确保跨组件/跨页面的风格一致性
降低重复性样式配置工作量
典型场景
场景1:企业VI规范落地
适用功能:图表色系 + 页面字体
典型案例:统一所有图表的品牌主色系,同步设置标准字体
场景2:数据状态可视化
适用功能:语义色
典型案例:全局设置库存预警红黄绿三色标
场景3:组件风格统一
适用功能:卡片圆角 + 卡片间距
典型案例:批量调整筛选器组件的圆角与间距参数
核心功能项
功能项 | 作用范围描述 | 可覆盖组件类型 |
主题模式 | 全局背景色/基础文字色/图表配色基准 | 除嵌入式iframe外的容器 |
图表色系 | 数据系列色/趋势线/分类标签 | 标准图表组件(含交叉表) |
语义色 | 阈值告警/涨跌符号/进度条状态 | 带语义标识的图表/组件 |
页面字体 | 标题/轴标签/图例/表格体文字 | 文本型组件+图表文字元素 |
卡片圆角 | 容器边框弧度/图表外框圆角 | 标准图表组件 |
卡片间距 | 组件间Gutter/内边距基线值 | 标准图表组件 |
前置条件或约束
您已登录Quick BI控制台并进入仪表板编辑页面。请参见新建仪表板
功能配置
针对仪表板全局样式的批量设置,可进入“页面编辑-主题-全局样式”下界面进行配置,具体配置项如下。
图表配置项 | 配置项说明 |
主题模式 | 支持浅色模式和深色模式。
默认皮肤为浅色模式。
|
图表色系 | 支持系统配置模板色系以及自定义色系。
说明 渐变色彩样式作用于指示类、趋势类以及比较类图表。 |
页面字体 | 配置图表页面字体类型。 |
卡片圆角 | 配置图表卡片边角弧度,支持无圆角、小圆角或大圆角。 |
间距 | 支持紧凑、常规和自定义三种方式。
|
卡片间间距 | 仅在间距选择自定义方式下可以设置,调整卡片行间距以及列间距。 |
卡片内边距 | 仅在间距选择自定义方式下可以设置,调整卡片内上下左右边的距离。 |
语义色 | 在条件格式、副指标展示等功能中,通常通过颜色来直观传递数据的上涨、持平、下跌等信息。在语义色配置项中,系统将会根据图表色系中所选的主题,自动匹配不同的默认语义色,您也可以在此按需自定义数据涨跌、正负、状态等含义的全局配色,使数据色系更贴合业务看数习惯。该配置项将对整个仪表板生效。
|
常见问题速查表
全局样式设置中遇到的问题 | 参考的功能 | 参考操作 |
想各绘图组件的色系统一 | 图表色系 | 可直接选定官方或自定义的色系 |
业务人员更习惯用楷体 | 页面字体 | 直接选择楷体 |
组件中的图标颜色想单独批量配置 | 语义色 | 针对不同语义设置单独颜色 |
柱状图组件的边角太直角不好看 | 卡片圆角 | 可设置小、大两种不同圆角方式 |
图表组件之间距离太大 | 卡片间距 | 针对行列间距进行设置 |
深色模式下图例看不清 | 主题模式 | 可切换为浅色模式 |