图表组件样式

  • 文档创建者:doreen0813
  • 编辑次数:20次
  • 最近更新:Roxy 于 2020-05-29
  • 1、描述

    图表的组件样式包括标题、图例、轴线、横向网格线、纵向网格线、背景的设置,通过这些设置可以调整图表的显示样式。

    222

    注:如果浏览器设置了最小字体,而仪表板图表中设置的最小字体小于浏览器的最小字体,那么以浏览器为准,比如说chrome浏览器的最小字体为12号,图表设置的字体大小为10号,在chrome下查看图表时,图表字体显示为12号,而非10号,故此时需要修改浏览器字体大小。

    2、标题

    标题设置包含了是否显示标题、标题内容和标题字体样式的设置。

    222

    默认组件标题为勾选显示,若不想显示,去掉勾选即可;

    222

    2.1 内容

    在标题的内容框可以修改标题文字和字体样式。如下图,点击内容框右下角的按钮对标题进行详细设置,包含加粗、斜体、加下划线等样式。

    222

    222

    标题中支持显示动态标题,即在标题栏的右上角按钮选择当前仪表板已添加的字段到标题中后,点击对应组件的对应字段,该标题将动态显示字段值。

    同时标题支持针对不同部分的字体进行单独设置颜色、大小等属性,如下图:

    222

    2.2 背景

    背景为设置组件标题背景的地方,支持设置颜色和上传图片作为标题背景。

    222

    3、图例

    3.1 设置图例字段

    在图形属性的颜色、大小和形状栏中拖入字段以后,图表中的图例会自动生成,且每个字段对应一个图例,如下图所示:

    1572315453684616.png

    不同图表类型可设置的图例如下表所示:

    图表类型
    可设置的图例
    柱形图颜色、大小
    点图颜色、大小、形状
    热力点热力色、大小
    线形图颜色、大小
    面积图颜色
    矩形块图颜色、大小
    饼图颜色、半径(即大小)
    文本图颜色、大小
    填充地图颜色
    漏斗图颜色、大小
    仪表板图颜色、大小

    3.2 图例设置

    在组件样式中的图例下,可对图例显示进行详细设置,包括是否显示图例、图例中字体的设置、图例的边框及位置。

    1) 字体

    其中字体支持自动自定义两种,自定义可修改显示字体的格式、大小、加粗都属性。

    222

    2) 位置

    默认图例的位置都为右方,可点击切换成上、下、左;

    222

    3) 边框

    图例边框可设置透明、默认或指定的颜色。

    222

    3.3 滑块图例

    以下两种情况的图例为滑块图例

    • 在热力色中添加的任何字段,该字段的图例都为滑块图例。

    • 当将指标字段拖入组件的「颜色」「大小」中且选择连续渐变,该指标的图例即为滑块图例。

    3.3.1 示例一:热力色

    1)在热力区域图中添加任意维度字段「注册日期」,如下图所示:

    image.png

    2)在组件样式中点击显示图例,「注册日期」的图例效果如下图所示:

    image.png

    3.3.2 示例二:指标字段拖入颜色和大小

    1)将指标字段「销售额」拖入颜色框,选择连续渐变,如下图所示:

    27.png

    2)在组件样式中点击显示图例,「销售额」的图例如下图所示:

    image.png

    3.4 注意事项

    问题现象:

    在Linux系统中因为没有默认安装微软雅黑字体,因此5.0版本在图例中显示时可能出现如下,内容显示不全的现象;

    222

    问题系统:Linux;

    问题版本:FineBI5.0;

    解决方案:

    此时可以通过在Linux系统中安装微软雅黑字体来解决该问题。安装过程可参考Linux安装微软雅黑字体

    4、轴线

    轴线指的是分区线及坐标轴线,在组件样式下可选择是否显示及显示的样式。

    222

    轴线显示与显示的效果如下图所示:

    222

    222

    轴线可设置的样式为线型、线宽大小和颜色,线型包括实线和虚线,根据需要进行切换设置即可。

    222

    5、横向网格线

    横向网格线与轴线类似,可设置是否显示及显示的线样式,显示样式可设置线型、线宽大小和颜色。

    222

    6、纵向网格线

    纵向网格线也与轴线类似,可设置是否显示及显示的线样式,显示样式可设置线型、线宽大小和颜色。

    222

    7、背景

    组件样式下的背景栏设置的为该组件的背景,可选择颜色和上传图片,如下图:

    222

    若为地图形式展示,则可进行gis背景设置,可以选择FineBI内置的各种gis背景,也可不使用gis背景。如下图:

    222

    8、自适应显示

    自适应显示为设置组件中图表自适应方式的地方,包含四种自适应方式:标准适应、整体适应、宽度适应和高度适应,默认为标准适应。

    222

    标准适应为FineBI根据组件图表的最佳视觉比例的展示效果,可拖拽调整横纵方向轴区间大小;

    宽度适应为图表在宽度方向(即横向)填充整个图表预览区域,纵向采取最佳比例,因此纵向可能出现滚动条,宽度适应时不可调整横轴的轴区间宽度;

    高度适应为图表在高度方向(即纵向)填充整个图表预览区域,横向采取最佳比例,因此横向可能出现滚动条,高度适应时不可调整纵轴的轴区间高度;

    整体适应为图形全部展示在图表区内,横向和纵向都填充满整个图表预览区域,不会出现滚动条,仅可调整横轴的轴区间高度和纵轴的轴区间宽度。可根据需要选择对应的组件自适应显示方式。


    附件列表


    主题: 制作可视化组件
    • 有帮助
    • 没帮助
    • 只是浏览
    • 评价文档,奖励 1 ~ 100 随机 F 豆!