基本立体柱状图
文档基于基本立体柱状图v1.4.1版本
组件说明
基本立体柱状图以立体柱状图的形式展示不同系列维度数据，支持自定义y轴区间和多个系列的数据配置，常用于展示数据分布或趋势变化。相比较基本柱状图数据显示更加立体化。
效果案例
一、样式
在样式中可以设置组件的参考线、基本属性、全局、坐标轴、系列和提示框。
1、子组件管理
参考线
参考线子组件可以设置线样式和数据样式
样式
配置项 | 说明 |
纵轴选择 | 可选择Y轴或Z轴 |
边距 | 自定义设置参考线的边距范围 |
线样式 | 可选择实线或虚线 |
颜色 | 线样式的背景颜色和透明度 |
粗细 | 线样式的粗细 |
虚线样式 | 格式使用半角字符 |
数据样式
配置项 | 说明 |
标签内容 | 自定义填写标签内容 |
文本样式 | 参考线标签的字体样式 |
偏移 | 参考线标签的偏移位置 |
颜色 | 线样式的背景颜色和透明度 |
粗细 | 线样式的粗细 |
数值 | 设置参考线数据的文本样式和偏移 |
数据
组件数据格式
字段 | 说明 |
value | 值，即参考线数值 |
*组件数据格式说明
JSON数据案例
[
{
"value": 125
}
]2、基本属性
位置尺寸
位置包括组件的横坐标和纵坐标，单位为px；横坐标为组件左上角距离页面左边界的像素距离，纵坐标为组件左上角距离页面上边界的像素距离。
尺寸包括组件的宽度和高度，单位为px；可单击比例锁锁定组件宽高比，等比例调整组件的宽高，比例锁默认不锁定。
基本柱状图组件尺寸不影响组件内容显示、组件动画。
*组件位置尺寸说明
默认隐藏
勾选之后在初始加载时组件默认隐藏且关闭回调触发，通常用来配合显隐控制，如【选项卡】组件进行显隐切换。
3、全局
边距
基本柱状图表距离整个组件四边（上、下、左、右）的边距
*边距样式说明
柱状样式
系列间距 | 不同系列数据柱子间间距。 |
柱间间距 | 每个代表的数据柱子之间间距。 |
外间距 | 整体数据与组件边缘间距离，比如1-10月份数据柱子与组件边缘间距。 |
柱子背景 | 数据柱子背景，可用来作为背景区分数据柱子。 |
图例
组件中图例配置项。
文本样式 | 图例中文本样式，可设置文本字体颜色、间距、倾斜度等。 |
图标尺寸 | 图例图标尺寸。 |
间距 | 图标与文本间间距。 |
布局 | 图例默认为一行布局，在此项可进行修改，列数：图例列数；间距：图例间行间距和列间距；位置：图例位于组件只的位置；偏移量：图例整体偏移量。 |
点击交互 | 是否开启点击交互，开启后可与其他组件进行事件交互。 |
未选中样式 | 开启点击交互后，可设置组件未被选中时的透明度样式。 |
*图例样式说明
轮播动画
开启轮播动画后，会自动轮播数据，可设置滚动时长和间隔时长。。
数据动画
默认未开启状态，开启后 首次加载和数据变化时会模拟加载动画效果。
4、坐标轴
组件坐标轴分为x轴、y轴、z轴，可通过「启用」来控制是否开启某一轴的数据。
当取消开启x轴后可x轴和x轴的相关配置项消失。
X轴
通过「启用」控制X轴显隐，可通过轴标签、轴线、刻度和网格线进行坐标轴样式配置：
配置项 | 说明 |
轴标签 | X轴的轴标签格式、文本样式、展示方式和偏移量。 |
轴线 | X轴的轴线颜色和粗细。 |
刻度 | X轴的刻度线的颜色、粗细、长度。 |
网格线 | X轴的网格线样式分布。 |
其中，X轴标签分为类目型和时间型两个不同维度：
类目型：以类目为单位，标签名由数据源提供，可设置展示、偏移和文本样式。
时间型：以时间为单位，可设置展示、偏移和文本样式。时间型如“2017-1-1”、“2017年01月01日”等，如下图：
*格式说明
Y轴
通过「启用」控制Y轴显隐，可通过轴标签、轴单位、轴线、刻度和网格线进行坐标轴样式配置：
配置项 | 说明 |
轴标签 | Y轴轴标签配置，包括数值范围、刻度自适应、后缀内容样式、偏移量、文本样式。 |
轴单位 | Y轴轴标签的单位，可调整单位内容、文本样式和偏移量。 |
轴线 | Y轴的轴线，支持修改颜色和粗细。 |
刻度 | Y轴的刻度线，可调整刻度线的颜色、粗细、长度。 |
网格线 | Y轴的网格线样式，可设置网格线虚线样式、颜色和粗细。 |
其中，Y轴标签支持以下刻度配置：
「数值范围」支持自定义输入，也支持系统选择，置空时系统根据数据中的最大/小值和指标点的个数自动计算；
「标签刻度」支持开启「刻度自适应」或设置「数量强制」和「步长强制」，非自适应情况下可自定义编辑标签、步长数量及小数位数；
Z轴
通过「启用」控制Z轴显隐，可通过轴标签、轴单位、轴线、刻度和网格线进行坐标轴样式配置：
配置项 | 说明 |
轴标签 | Z轴轴标签配置，包括数值范围、刻度自适应、后缀内容样式、偏移量、文本样式。 |
轴单位 | Z轴轴标签的单位，可调整单位内容、文本样式和偏移量。 |
轴线 | Z轴的轴线，支持修改颜色和粗细。 |
刻度 | Z轴的刻度线，可调整刻度线的颜色、粗细、长度。 |
网格线 | Z轴的网格线样式，可设置网格线虚线样式、颜色和粗细。 |
其中，Z轴标签同样支持以下配置：
「数值范围」支持自定义输入，也支持系统选择，置空时系统根据数据中的最大/小值和指标点的个数自动计算；
「标签刻度」支持开启「刻度自适应」或设置「数量强制」和「步长强制」，非自适应情况下可自定义编辑标签、步长数量及小数位数；
5、系列
数据系列
当图表数据存在多类型展示需求时，组件默认将数据划分成多个系列，用户可通过对各系列数据进行自定义数据映射，从而完成对每个系列配置相应样式。
*系列说明
其中，数据系列操作支持：
：增加一个系列数据。
：删除一个系列数据。
：调整系列的显示格式（纵向展示、横向展示）。
极值高亮：开启后当数据为最大或者最小值时数据可以设置高亮显示。
数值标签
在每一个数据柱子上都可以显示数值标签，在设置标签中可设置数值标签文本样式和偏移量。
*数值标签样式说明
6、提示框
自动轮播
默认未开启，开启后提示框按轴标签横向轮播。
悬停触发
支持鼠标焦点移入到对应的数据点后会显示当前对应的数据提示框。
停留时间
当开启自动轮播后，数据进行轮播时在数据柱子中的停留时间。
提示框
提示框整体氛围提示框样式和框内数据样式两部分。
1、偏移
提示框偏移量。
2、背景
提示框背景，可设置为自定义图片。
3、尺寸
提示框整体尺寸。
4、边距
提示框内数据与提示框间间距。
5、框内数据
在框内数据中可设置X轴标签、行高和数据样式。
a. X轴标签
提示框内X轴轴标签样式配置项，可设置文本样式、对齐方式和偏移量。
b. 行高
提示框内每个数据值间的行高
c. 数据样式
提示框内数据分为系列和系列值两部分，此项可分别设置系列和系列值文本样式。
指示器
粗细
指示器区域粗细。
颜色
指示器颜色。
*指示器说明
二、数据
组件数据格式
字段 | 说明 |
x | 类目，即x轴文本 |
y | 值，即y轴数值 |
s | 系列，即数据系列。 |
*组件数据格式说明
JSON数据案例
[
{
"x": "2010/01/01 00:00:00",
"y": 180,
"s": "系列一"
},
{
"x": "2010/01/01 00:00:00",
"y": 320,
"s": "系列二"
},
{
"x": "2010/02/01 00:00:00",
"y": 200,
"s": "系列一"
},
{
"x": "2010/02/01 00:00:00",
"y": 120,
"s": "系列二"
},
{
"x": "2010/03/01 00:00:00",
"y": 160,
"s": "系列一"
},
{
"x": "2010/03/01 00:00:00",
"y": 180,
"s": "系列二"
},
{
"x": "2010/04/01 00:00:00",
"y": 200,
"s": "系列一"
},
{
"x": "2010/04/01 00:00:00",
"y": 160,
"s": "系列二"
},
{
"x": "2010/05/01 00:00:00",
"y": 180,
"s": "系列一"
},
{
"x": "2010/05/01 00:00:00",
"y": 220,
"s": "系列二"
},
{
"x": "2010/06/01 00:00:00",
"y": 180,
"s": "系列一"
},
{
"x": "2010/06/01 00:00:00",
"y": 220,
"s": "系列二"
}
]数据配置项说明
配置项 | 说明 |
数据源 | 数据源类型、数据源选择等 |
数据过滤器 | 勾选启用数据过滤器，单击添加过滤器，可在设置数据源页面中配置数据过滤器，详情请参见数据过滤器使用说明 |
数据响应结果 | 展示数据请求的响应结果 |
自动更新 | 选中后可以设置数据请求时间间隔 |
数据对接详情
数据对接详情请见以下文档👇
三、交互
当前组件通过载入动画、回调参数、自定义事件三种方式设置组件交互。
载入动画
所有组件均提供移入、移入(小)、划变三种组件载入动画。
载入动画选择无时，则组件没有载入动画。
载入动画仅在可视化应用预览、发布组件加载时显示。
配置项 | 说明 |
渐隐渐显 | 启用是 |
速率 | 匀速、慢快慢(cubic-bezier(0.25,0.1,0.25,1))、低速开始、低速结束、低速开始和结束(cubic-bezier(0.42,0,0.58,1)) |
方向 | 动画方向 |
持续时间 | 载入动画持续时间，单位为ms |
延时 | 载入动画延时长，单位为ms |
回调参数
回调参数即为全局性的参数变量，用于控制组件之间参数的传递，可通过设置回调参数来实现数据驱动交互。
其中，字段值即参数变量，变量名即对字段值的重命名。
详细的回调参数教学👉 回调的使用
自定义事件
自定义事件为「交互事件」的增强模块，支持通过数据驱动组件状态、或变更组件样式配置，也可自定义编辑复杂的条件逻辑；
详细的自定义事件教学👉自定义事件教学
欢迎您在评论区留下您对该组件的意见，管理员会及时回复您，如长时间未回复欢迎您搜索钉钉群：33782396或者扫描以下二维码添加微信群 说出您的想法，采纳后将送出定制礼品。
也可以通过问卷来向我们反馈需求：https://jinshuju.net/f/XyCXU0