Skip to main content

文档基于华势BI可视化报表v2.0版本

组件说明

漏斗图有漏斗状和金字塔状两种显示样式,可分层显示不同数据的占比情况,按数据的大小进行排列。

效果案例

漏斗图效果案例

* 漏斗图效果案例

数据绑定

在数据Tab页中可以设置组建的数据来源为数据集市数据库表静态数据

漏斗图的数据集市

配置项说明
维度只能拖入维度下的文件,拖入的文件内的字段将作为图表的图例进行展示
展示名称可自定义维度字段显示的名称
空值处理当维度数据为空时,可选择空数据显示的样式
排列方式可根据维度选择进行降序或升序排列
度量只能拖入度量下的文件,拖入的文件内的数据会作为漏斗图的数据进行展示,每个数据占总数据的比例决定其在漏斗图中的占比大小
展示名称可自定义度量字段显示的名称
聚合方式数据显示的方式,可选择求和平均值
数据格式化默认数据单位:可给数据添加单位 示例:为所输入样式的最终效果
数值小数位:可选择数据保留小数点后几位数使用千分位:即从个位数起,每三位之间加一个逗号
货币前缀:给数据前面加上前缀
百分比除以100:将数据除以100
排列方式可根据度量选择进行降序升序排列
数据筛选设置筛选条件直接对数据进行筛选,可选择AND(并且)和OR(或者)为各个筛选条件的关系。添加规则和分组后筛选字段为文档中的字段,关系条件可选择“=”“>”⁢等关系符号,后面跟上自己想要的筛选数据
设置聚合筛选条件数据聚合后进行筛选,可选择AND(并且)和OR(或者)为各个筛选条件的关系。添加规则或分组后筛选字段为维度和度量中的字段,关系条件可选择“=”“>”⁢等关系符号,后面跟上自己想要的筛选数据
数据缓存数据缓存的时间,可选择不缓存、一小时七小时
定时刷新数据定时更新的时间,可自定义选择定时更新的时间数据并选择时、分、秒等时间单位
结果展示可选择展示的数据数量
更新点击后立即更新数据
调试查看图表配置后执行的SQL语句和格式化后的数据

:展示不同「学院」的「费用金额」对比:

不同学院的费用金额对比

* 不同学院的费用金额对比

漏斗图的静态数据

可以通过设置表格数据的方式来直接绘制图表,展开「数据来源」下拉框后选择「静态数据」,再点击「编辑表格数据」即可通过表格数据绘制漏斗图,编辑表格数据时,右侧图表会实时展示数据效果

静态数据设置演示

* 静态数据设置演示

图表样式

​ 在样式中可以设置组件的「漏斗图属性」、「组件属性」、「标题属性」、「图例属性」、「背景和边框」、「图表配色」、「Tooltip样式配置」

漏斗图属性

基础设置

配置项说明
数据排列方式数据的排列方式,从小到大金字塔状从大到小漏斗状

漏斗图基础设置演示

* 漏斗图基础设置演示

组件属性

配置项说明
组件名称该组件的名称
组件实际宽度该组件当前的宽度,默认为400
组件实际高度该组件当前的高度,默认为250
X轴位置表示当前图表距离画布左侧的距离
Y轴位置表示当前图表距离画布顶部的距离

组件属性说明

  • 组件属性说明

标题属性

配置项说明
标题图表的标题,显示在图表的上方,可修改
启用标题开启后在图表上方显示标题文本框的内容,并开启设置标题其他样式的功能
标题字号图表标题的字体大小,默认「16」
标题粗细图表标题字体的粗细,默认正常,可选值:细小正常粗重
标题字体图表标题字体样式,默认为微软雅黑,可选择宋体黑体
标题颜色图表标题字体的颜色,可修改
对齐方式可选择该标题的对齐方式,默认为左对齐左对齐右对齐居中对齐
标题行高该标题所在整个标题部分的垂直位置,标题行高应与标题高度一致,支持修改
标题高度整个标题部分的高度,默认与标题行高一致(40)
标题内边距标题距离边框的距离,默认0 0 0 10,单位为px,依次为上、右、下、左,可修改
图表简介输入对该图表的介绍,不会在图表上体现

标题设置演示

* 标题设置演示

图例属性

配置项说明
显示图例开启后可显示图例的样式设置
字体图例的字体样式,可选择宋体黑体
字体字号图例字体的文字大小,支持修改
字体颜色图例的字体颜色,支持修改
图例排列方向图例文字的排列方向,可选择水平方向垂直方向
图例水平位置图例文字的水平位置,可选择图例位置为左侧对齐右侧对齐居中对齐
图例竖直位置图例文字的竖直位置,可选择图例位置为顶部对齐竖直居中底部对齐

图例属性设置演示

* 图例属性设置演示

背景和边框

配置项说明
背景和边框开启后可显示标题背景和组件背景的设置功能

标题背景设置

配置项说明
背景颜色标题背景的颜色,支持修改
背景图片标题背景照片,支持自定义选择

组件背景设置

配置项说明
背景颜色组件背景的颜色,支持修改
背景图片组件的背景照片,支持自定义选择

标题背景和组件背景设置演示

* 标题背景和组件背景设置演示

标题底部边框设置

配置项说明
底部边框线标题底部边框的样式,可选择直线虚线点线双实线
底部边框宽度标题底部的边框宽度,可自定义修改
底部边框颜色标题底部的边框颜色,可自定义修改

组件边框设置

配置项说明
边框线类型组件边框的样式,可选择直线虚线点线双实线
边框宽度组件边框的宽度,支持修改
边框颜色组件边框的颜色,支持修改
圆角组件边框四个角的弧度,支持修改

标题底部边框和组件边框设置演示

* 标题底部边框和组件边框设置演示

组件阴影设置

配置项说明
阴影宽度组件阴影的宽度,默认为空,支持修改
阴影颜色组件阴影的宽度,支持修改
阴影颜色X轴偏移组件阴影颜色向X轴方向偏移距离,可修改
阴影颜色Y轴偏移组件阴影颜色向Y轴方向偏移距离,可修改

组件阴影设置演示

* 组件阴影设置演示

图表配色

配置项说明
图标渐变色可为每个数据多边形的边框添加渐变色样式,数量可增加
渐变色样式每个渐变色样式对应每个图例,支持修改图例的渐变色以及渐变色角度和渐变色起始值、终止值

图标配色样式

* 图标配色样式

Tooltip样式配置

配置项说明
tooltip背景颜色tooltip提示框的背景颜色
tooltip边框颜色tooltip提示框的边框颜色
tooptip边框宽tooltip提示框的边框宽度
tooltip内边距tooltip提示框内的提示内容距离边框的距离
tooltip文字的颜色tooltip提示框内文字的颜色
tooltip字体大小tooltip提示框内文字的大小