历史版本15 :【新】FVS模板样式 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:
icon提示:

本文适用场景:

安装了 V3.2.0 及以上版本的「FineVis数据可视化」插件的用户。

若插件版本低于 V3.2.0 版本,请参考:FVS模板样式

本文功能优势:

相对于老版主题样式,新版主题样式有以下优势:

1)更多内置主题: 内置了 8 种主题样式可供选择。

2)主题样式优化:

  • 统一设定:主题样式设置不再区分主题样式和组件样式,包含除大小、尺寸相关属性以外的所有内容配置。

  • 分类支持:支持局部样式的切换。

  • 应用范围:不仅适用于主题样式,还适用于整个主题规范下的所有内容,包括组件背景、字体颜色等。

  • 组件覆盖:新增覆盖表格组件、地图、部分高频使用的扩展图表以及分析组件。

3)取色器优化:支持选择主题颜色,快速适配主题风格;支持选择标准颜色,支持从历史颜色中快速选择颜色。

目录:

1. 概述编辑

1.1 版本

报表服务器版本
插件版本功能变动
11.0.22V3.2.0-

1.2 应用场景

在创建 FVS 模板时,可提前选择模板样式,对模板的「主题样式」和「组件样式」进行预定义,提升后续模板制作效率。

2D51B819-4C47-408A-BBE4-C606045CE7D8.GIF

1.3 功能简介

1)模板样式可通过「服务器>FVS模板样式管理」进行管理,包含 8 种内置样式,支持创建自定义样式。

2)创建空白看板时需选择一种模板样式,模板样式为一次性应用,即编辑模板样式不影响已使用样式的模板。

使用建议:提前创建自定义样式,预定义好需要的样式,再新建模板。

2. 模板样式应用编辑

2.1 创建空白看板

新建空白可视化看板时,模板样式展示当前服务器下所有的「内置样式」和「自定义样式」,需选择一种样式后创建看板。

1)内置样式:FVS 内置了 8 种主题样式可供选择,默认选择「暮海深蓝」样式。

2)自定义样式:若未添加过自定义样式,会提示「暂无自定义样式,前往FVS模板样式管理进行添加」。

  • 点击「FVS模板样式管理」打开弹窗,可复制内置样式或创建新样式进行自定义。

  • 添加后需关闭弹窗,回到模板样式选择界面,点击右下角「刷新资源」,获取自定义的模板样式。

  • 已有自定义样式时,也可点击左下角「FVS模板样式管理」,打开模板样式管理弹窗。

如下图所示:

5-1.gif

2.2 切换主题样式

创建可视化看板后,可通过模板右上角「切换主题样式」按钮,切换当前模板「主题样式」。

  • 由于模板样式为一次性应用,所以这里不会选中当前应用的模板样式。

  • 在「FVS模板样式管理」中修改模板样式不影响当前模板,若需要应用修改后「模板样式」中的「主题样式」,需重新选中并切换。

  • 切换主题样式面板下方「FVS模板样式管理」和「刷新资源」按钮与创建模板时的用法一致。

6 (1).gif

3. 模板样式管理编辑

3.1 功能入口

点击顶部菜单栏「服务器>FVS模板样式管理」,即可打开弹窗。

Snag_2e94e11a.png

3.2 内置样式

FVS 内置了 8 种样式,内置样式不支持编辑、删除等功能,仅支持复制为自定义样式。

鼠标悬浮样式,点击右上角复制按钮,即可将其复制到自定义样式。

3.3 自定义样式

自定义样式界面左上角固定显示「创建新样式」卡片,鼠标悬浮时,出现「从深色样式创建」和「从浅色样式创建」两个按钮,点击后弹出「模板样式设置」弹框。

自定义样式支持删除、编辑和复制,鼠标悬浮样式,点击右上角按钮即可进行对应操作。

Snag_9ba9dfcf.png

4. 主题样式设置编辑

4.1 主题样式组成

自定义样式界面,鼠标悬浮样式,点击右上角「编辑」按钮,即可进入主题样式设置界面。

主题样式设置包括样式名称、预览图、主题配色、背景、图表、控件 6 个部分。如下图所示:

主题样式的具体设置如下表所示:

配置项内容设置
生效范围
样式名称不支持为空或重名-
预览图

显示标题、控件以及图表示例

修改样式配置时,预览图即时生效

-
主题配色

可配置 10 个色块的颜色

  • 背景颜色、文字颜色:显示为默认颜色,随深浅主题变化。支持自定义

  • 组合色:应用于图表配色方案,可在下拉列表选择不同的配色方案或自定义配色

所有取色
背景

支持设置为 无、颜色、我的资源、自定义上传

注:暂不支持三维背景页背景。

分页背景
图表

支持配置图表图例、标签、系列、坐标轴、背景、提示中的部分设置项

其中,「系列」中支持配置组合色和渐变色:

  • 组合色:默认采用主题配色的组合色,支持下拉选择变更其他组合色方案

  • 渐变色:设置在图表配色选择渐变色时的默认值

对所有基础图表、扩展图表有效。

不支持的图表类型:

  • 轮播夜光仪表盘

  • 电子智慧树图、模型智慧树图

  • 轮播三维组合地图、轮播 GIS 点地图、场景地图

  • 三维柱形、点、流向地球



控件

内容设置:支持配置控件内容部分设置项

组件设置:支持配置边框背景、边框线、不透明度

注1:查询控件背景色受到控件高亮色影响

注2:控件可以单独设置图标颜色

对所有控件生效

4.2 主题样式切换规则

对于不同的组件对象,切换主题样式的生效机制如下表所示:

对象
生效机制
新建组件按照最新主题样式规范生效
已有组件切换主题样式,按照新的样式覆盖
资源中心组件

拖入后,默认按照原来的样式生效

切换主题样式后,按照新的主题样式生效

5. 注意事项编辑

1)部分组件暂时不支持配置样式,但在深浅主题下会区分显示。例如:

  • 表格工具栏开放「工具栏背景」和「按钮风格」设置,详情可参见 FVS表格工具栏应用 。

  • 设计器满足 11.0.26 及之后版本,表格内容文本颜色区分深/浅主题,显示为白色/黑色,之前版本中始终为白色。

  • Tab组件的默认样式选择「联排样式」时,Tab 栏按钮可跟随主题样式显示。

  • 控件下拉面板的背景区分深浅主题,文字选中效果跟随主题样式显示。

2)复制粘贴不同样式模板中的组件,不受当前模板样式影响,需在「切换主题样式」中重新选择主题并切换。

1714128558855770.gif

3)若配置外接 MySQL 数据库,在「主题样式>页面背景」中选择自定义上传图片时,可能出现图片显示异常。需调整 MySQL 配置文件 my.ini,将 max_allowed_packet 参数值(默认为 4M)调大,重启 MySQL 服务后,重新上传图片即可恢复正常。