主题设计

更新时间: 2023-08-31 16:16:13

您可以通过主题设计更换仪表板的主题模板、全局样式、页面布局、组件样式等内容。本文为您详细介绍仪表板页面设置中主题设置功能。

前提条件

您已登录Quick BI控制台并进入仪表板编辑页面。请参见新建仪表板

操作步骤

  1. 在仪表板编辑页面,单击顶部菜单栏的页面设置

    image
  2. 页面设置主题页签,设置仪表板主题模板全局样式页面布局等配置项。

    image

    当您需要快速查找定位到某个配置项时,可以在顶部搜索框中进行关键字查询,将展示配置选项。

    image

    当您需要一键收起所有配置类别项时,单击搜索框右侧的image图标,选择收起所有类别即可完成操作。

    收起类别
  3. 配置参数如下:

    • 仪表板主题区域,选择主题模板。

      目前支持官方、深蓝、星空、科技、活动、简约、靛蓝自定义主题

      说明

      Quick BI专业版群空间下支持自定义仪表板的主题

      • 如果您是组织管理员,可以选择官方推荐主题或新增自定义主题。

      • 如果您是非组织管理员,可以选择官方推荐主题或已经存在的自定义主题,不能新增自定义主题。

    • 全局样式中,设置主题的全局样式。

      图表配置项

      配置项说明

      主题模式

      支持浅色模式深色模式

      • 选用浅色模式时,仪表板背景色为白色。

        默认皮肤为浅色模式

      • 选用深色模式时,仪表板背景色为黑色。

      图表色系

      支持系统配置模板色系以及自定义色系。

      • 当选择图表色系模板色系时,您可以在下拉列表中选择色系。

        image例如,色系选择为高级灰调,切换后图表如下所示。

        image
      • 当选择图表色系自定义时,您可以修改每一个色块的颜色。

        image
        说明

        渐变色彩样式作用于指示类、趋势类以及比较类图表。

      页面字体

      配置图表页面字体类型

      卡片圆角

      配置图表卡片边角弧度,支持无圆角、小圆角或大圆角。

      间距

      支持紧凑、常规自定义三种方式。

      image

      卡片间间距

      仅在间距选择自定义方式下可以设置,调整卡片行间距以及列间距。

      卡片内边距

      仅在间距选择自定义方式下可以设置,调整卡片内上下左右边的距离。

    • 页面布局区域,配置以下参数。

      图表配置项

      配置项说明

      页面信息

      支持配置页面标题区内容、故事大纲、页尾内容

      image

      页面背景

      配置背景颜色,支持纯色、渐变两种方式,选择是否叠加背景图片。

      页面宽度

      支持自适应、固定两种方式。

      说明

      选择固定方式时,需要设置页边距左右像素大小,设置完成后页边距设置时左右边距固定不可调整。

      页边距

      支持选择常规、超宽页面自定义三种方式。

      image
    • 仪表板背景区域,配置以下参数。

      图表配置项

      配置项说明

      顶部图片底部图片

      选择图片时,您可以选择已有图片自定义图片

      说明

      选择自定义图片时,可以选择上传本地图片或则通过目标图片的链接上传。

    • 仪表板组件区域,配置以下参数。

      image.png

      图表配置项

      配置项说明

      标题

      文本

      设置图表标题的字号对齐方式

      分割线

      设置标题分割线颜色、宽度大小。

      自定义标题背景

      支持配置标题的背景及标题区域位置。

      • 选择单色时,您可以配置背景颜色

      • 选择渐变时,您可以配置渐变配色渐变角度

      • 选择叠加背景图片时,您可以选择使用素材或自定义图片。

        说明

        选择自定义图片时,可以选择上传本地图片或者通过目标图片的链接上传。

      • 标题区域位置支持图表内部、图表边缘图表上方

      操作icon

      您可以在此选择操作图标的颜色。

      tab内图表操作icon

      您可以在此选择tab内操作图标的颜色。

      预览态下,隐藏更多操作入口

      您勾选该配置项后,在预览态页面,将隐藏更多操作的选择入口。

      背景样式

      填充

      设置背景是否显示填充颜色。

      叠加背景图片

      为图表背景叠加图片素材或自定义图片。image.png

      边框

      设置背景是否显示边框以及边框颜色。

      显示阴影

      设置背景是否显示阴影。

    • 通用内容样式区域,配置以下参数。

      图表配置项

      配置项说明

      图类样式

      轴标题

      设置轴标题字体大小、颜色样式等。

      轴标签

      设置轴标签字体大小、颜色样式等。

      数据标签

      设置数据标签字体大小、颜色样式等。

      工具提示

      设置工具提示字体大小、颜色样式等。

      图例

      设置图例字体大小、颜色样式等。

      表类样式

      样式设置

      您可以在此设置样式,支持斑马线、线框、简版、极简四种样式。

      主色系

      您可以在此设置主色系,支持主题色、灰色、自定义三种色系。

      表头

      设置表头字体大小、颜色等。

      内容

      设置内容字体大小、颜色等。

    • TAB组件区,配置以下参数。

      图标配置项

      配置项说明

      TAB选中样式

      您可以在此设置TAB选中样式,支持下划线、分割线、选中块三种样式。

      Tab标签样式

      您可以在此设置tab标签字号大小、默认态样式、选中态样式。

      显示TAB内部可视化卡片边框

      设置是否显示TAB内部可视化卡片边框,支持选择颜色。

    • 查询控件区,配置以下参数。

      图标配置项

      配置项说明

      显示查询控件边框

      设置是否显示查询控件边框,支持选择颜色。

      条件标题

      您可以在此设置条件标题的字体颜色。

      交互按钮

      您可以在此设置交互按钮颜色。

  4. 配置完成后,单击保存

阿里云首页 Quick BI 相关技术圈