组件说明
双轴图是柱状图和折线图的结合图表，可按需选择柱状样式和折现样式来展示数据，支持多数据配置，能直观感受数据的变化情况。
效果案例
* 柱线混合图效果案例
数据绑定
在数据Tab页中可以设置组建的数据来源为数据集市、数据库表和静态数据
柱线混合图的数据集市
| 配置项 | 说明 | |
|---|---|---|
| 维度 | 只能拖入维度下的文件，拖入的文件内的字段将作为图表的X轴进行展示 | |
| 展示名称 | 可自定义维度字段显示的名称 | |
| 空值处理 | 当维度数据为空时，可选择空数据显示的样式 | |
| 排列方式 | 可根据维度选择进行降序或升序排列 | |
| 度量 | 只能拖入度量下的文件，拖入的文件内的字段会根据度量进行分类汇总，最终值的大小影响柱体的高度 | |
| 展示名称 | 可自定义度量字段显示的名称 | |
| 聚合方式 | 数据聚合的方式，可选择求和、平均值等 | |
| 数据格式化 | 默认 | 数据单位：可给数据添加单位 示例：为所输入样式的最终效果 |
| 数值 | 小数位：可选择数据保留小数点后几位数使用千分位：即从个位数起,每三位数之间加一个逗号隔开 | |
| 货币 | 前缀：给数据前面加上前缀 | |
| 百分比 | 除以100：将数据除以100 | |
| 排列方式 | 可根据度量选择进行降序或升序排列 | |
| 图例 | 只能拖入维度下的文件，拖入的文件内的字段会数据在维度分组的基础上叠加 | |
| 数据筛选 | 设置筛选条件 | 直接对数据进行筛选，可选择AND（并且）和OR（或者）为各个筛选条件的关系。添加规则和分组后筛选字段为文档中的字段，关系条件可选择“=”“>”等关系符号，后面跟上自己想要的筛选数据 |
| 设置聚 合筛选条件 | 数据聚合后进行筛选，可选择AND（并且）和OR（或者）为各个筛选条件的关系。添加规则或分组后筛选字段为维度和度量中的字段，关系条件可选择“=”“>”等关系符号，后面跟上自己想要的筛选数据 | |
| 数据缓存 | 数据缓存的时间，可选择不缓存、一小时和七小时 | |
| 定时刷新 | 数据定时更新的时间，可自定义选择定时更新的时间数据并选择时、分、秒等时间单位 | |
| 结果展示 | 可选择展示的数据数量 | |
| 更新 | 点击后立即更新数据 | |
| 调试 | 查看图表配置后执行的SQL语句和格式化后的数据 |
柱线混合图的静态数据
可以通过设置表格数据的方式来直接绘制图表，展开「数据来源」下拉框后选择「静态数据」，再点击「编辑表格数据」即可通过表格数据绘制柱线混合图，编辑表格数据时，右侧图表会实时展示数据展效果，例如[每月]的[地区]的[GDP]
* 编辑表格实时展示数据演示
图表样式
在样式中可以设置组件的「柱状图类型、柱体、标签线设置」、「折线图 类型、标签线设置」、「线条发光设置」、「线点标记设置」、「X轴和分割线设置」、「Y轴和分割线设置」、「图形边距设置」、「组件属性」、「标题属性」、「图例属性」、「背景和边框」、「图表配色」、「Tooltip样式配置」
柱状图类型、柱体、标签线设置
柱状图类型
| 配置项 | 说明 |
|---|---|
| 设为堆积图 | 默认关闭，开启后将X轴的同一柱体数据堆叠在一个柱子上 |
| 柱顶展示数据 | 开启后将会在每个堆叠的不同柱子的顶部显示柱子的实际数据值 |
* 柱状图类型样式
* 柱状图类型设置演示
柱体设置
| 配置项 | 说明 |
|---|---|
| 柱体最大宽度 | 默认为空，单位为px，设置之后会限制每条柱子的最大宽度 |
| 柱体圆角 | 默认为空，单位为px，设置之后会将柱子顶部的棱角变圆滑 |
* 柱体设置演示
Tooltip轮播
| 配置项 | 说明 |
|---|---|
| 开启****tooltip轮播 | 开启后会自动轮番播放每个维度上的数据情况 |
| T****ooltip停留时间 | 可自定义播放时每个维度上停留的时间 |
- tooltip轮播演示
折线图类型、标签线设置
| 配置项 | 说明 |
|---|---|
| 折线平滑 | 开启后会将折线变成一条弯曲的曲线，而不是数个直线组成的折线 |
| 面积图 | 开启后将X轴与折线包含的部分赋予背景 |
* 折线类型设置演示
线条发光设置
| 配置项 | 说明 |
|---|---|
| 启用发光效果 | 开启后可显示折线的发光效果 |
| 发光颜色 | 可选择折线的发光颜色 |
| 偏移 | 设置发光效果的偏移方向，X代表X轴，Y代表Y轴，距离可自定义设置 |
| 发光半径 | 发光效果的大小，可自定义设置 |
* 线条发光设置演示
线点标记设置
图形标记设置
| 配置项 | 说明 |
|---|---|
| 标记最大值 | 开启后会在不同类型柱子和折线的最大值部分的顶部显示其值 |
| 标记最小值 | 开启后 会在不同类型柱子和折线的最小值部分的顶部显示其值 |
| 标记背景颜色 | 可选择标记最大值和最小值的图形的颜色 |
| 标记文字颜色 | 可选择标记最大值和最小值的文字的颜色 |
| 标记图形大小 | 可自定义标记图形的大小 |
| 标记图形 | 可选择标记图形的样式 |
标线设置
| 配置项 | 说明 |
|---|---|
| 展示均值线 | 开启后可展示每个类型数据的均值线 |
| 标记大小 | 标线起点的标记图形的大小 |
| 标记图形 | 可选择标记的图形样式 |
* 标线设置样式
* 标线设置演示
X轴和分割线设置
坐标轴设置
| 配置项 | 说明 |
|---|---|
| 坐标轴 | 控制坐标轴是否显示，关闭后即X轴坐标轴不显示，默认开启 |
| 反向坐标轴 | 开启后会将X轴上的数据进行左右反向显示 |
| 轴线类型 | X坐标轴线类型，可选择数值轴、类目轴、时间轴和对数轴 |
| 轴线宽度 | 设置Y轴的轴线宽度，仅对类目轴生效 |
* X坐标轴轴线样式
* 坐标轴轴线设计演示
标签设置
| 配置项 | 说明 |
|---|---|
| 全部标签 | 控制是否强制显示全部标签，关闭后当X轴标签互相覆盖时会选择性展示X轴标签，默认开启 |
| 标签字体颜色 | 调整该项可设置X轴标签的文字颜色 |
| X轴标签倾斜度 | 可选择X轴标签倾斜度 |
| 文字方向 | 标签文字的方向，可选择横向或竖向 |
| 文字宽度 | 用于控制X轴标签文字的宽度，有宽度限制时超过限制会显示省略号（默认），可通过文字超出模式控制超出宽度时的显示模式，默认为空 |
| 文字高度 | 用于控制X轴标签文字的高度，有高度限制时超过限制会显示省略号（默认），可通过文字超出模式控制超出高度时的显示模式，默认为空 |
| 文字超出模式 | 控制标签文字超出限制后的展示方式，默认为省略号，可选项为：显示…、按单词换行和按字母换行 |
| 开启X轴缩放 | 通常在数据过多时使用，开启后可配置缩放起始和缩放结束来设置缩放区域，即只显示起始区域到结束区域的数据。可以手动调整区域大小，默认关闭 |
| 缩放起始 | 选择数据范围的起始值，仅在开启X轴缩放后生效 |
| 缩放结束 | 选择数据范围的终止值，仅在开启X轴缩放后生效 |
| X轴名称 | 可自定义X轴的名称，在X轴最右方显示 |
| X轴名称颜色 | 可选择X轴名称的颜色 |
* X轴标签说明
* 标签设置演示
* X轴缩放功能演示
X轴分割线
| 配置项 | 说明 |
|---|---|
| 是否显示 | 开启后以X轴上每个数据划分一条线，可更直观显示数据的分布情况 |
| 分割线类型 | 可选择X轴分割线的样式，实线、虚线或点线 |
| 颜色 | 可选择X轴分割线的颜色 |
* X轴分割线
* X轴分割线设置演示
Y轴和分割线设置
坐标轴设置
| 配置项 | 说明 |
|---|---|
| 坐标轴 | 控制坐标轴是否显示，关闭后即Y轴坐标轴不显示，默认开启 |
| 反向坐标轴 | 开启后会将X轴上的数据进行上下反向显示 |
| 轴线类型 | Y坐标轴线类型，可选择数值轴、类目轴、时间轴和对数轴 |
| 轴线宽度 | 设置Y轴的轴线宽度，仅对类目轴生效 |
* Y坐标轴设置演示
标签设置
| 配置项 | 说明 |
|---|---|
| 标签字体颜色 | 可选择Y轴标签字体颜色 |
| Y轴标签倾斜度 | 可选择Y轴标签倾斜度 |
| 数据前置单位 | 在Y轴数据标签前面添加设置的单位 |
| 数据单位 | 在Y轴数据标签后面添加设置的单位 |
| Y轴名称 | 可命名Y轴的名称，在Y轴最右边显示 |
| Y轴名称颜色 | 可选择Y轴名称的颜色 |
* Y轴标签设置演示
Y轴分割线
| 配置项 | 说明 |
|---|---|
| 是否显示 | 开启后以Y轴上每个数据划分一条线，可更直观显示数据的分布情况 |
| 分割线类型 | Y轴分割线的样式，可选择实线、虚线或点线 |
| 颜色 | 可选择Y轴分割线的颜色 |
* Y轴分割线
* Y轴分割线设置演示
图形边距设置
| 配置项 | 说明 |
|---|---|
| 是否包含标签 | 开启后会给标签预留空间，避免标签被顶出组件 |
| 图形顶部距离 | 图形距离组件顶部的距离，可自定义修改 |
| 图形底部距离 | 图形距离组件底部的距离，可自定义修改 |
| 图形左侧距离 | 图形距离组件左侧的距离，可自定义修改 |
| 图形右侧距离 | 图形距离组件右侧的距离，可自定义修改 |
* 图形边距说明
组件属性
| 配置项 | 说明 |
|---|---|
| 组件名称 | 该组件的名称 |
| 组件实际宽度 | 该组件当前的宽度，默认为400 |
| 组件实际高度 | 该组件当前的高度，默认为250 |
| X轴位置 | 表示当前图表距离画布左侧的距离 |
| Y轴位置 | 表示当前图表距离画布顶部的距离 |
- 组件属性说明
标题属性
| 配置项 | 说明 |
|---|---|
| 标题 | 输入该图表的标题，显示在图表的上方 |
| 启用标题 | 开启后可显示所输入的标题，并可开启设置标题其他样式的功能 |
| 标题字号 | 该图标标题的字体大小，支持修改 |
| 标题粗细 | 图表标题字体的粗细，默认正常，可选值：细小、正常、粗重 |
| 标题字体 | 图表标题字体样式，默认为微软雅黑，可选择宋体或黑体等 |
| 标题颜色 | 该标题字体的颜色，支持修改 |
| 对齐方式 | 可选择该标题的对齐方式，左对齐、右对齐或居中对齐 |
| 标题行高 | 该标题所在整个标题部分的垂直位置，标题行高应与标题高度一致，行高支持修改 |
| 标题高度 | 整个标题部分的高度，默认与标题行高一致（40） |
| 标题内边距 | 标题距离边框的距离，默认为空，单位为px，依次为上、右、下、左，可自定义修改 |
| 图表简介 | 输入对该图表的介绍，不会在图表上体现 |
**
**
* 标题样式说明
* 标题设置演示
图例属性
| 配置项 | 说明 |
|---|---|
| 显示图例 | 开启后可显示图例的样式设置 |
| 字体 | 图例的字体样式，可选择宋体或黑体等 |
| 字体字号 | 图例的字体的文字大小，支持修改 |
| 字体颜色 | 图例的字体颜色，支持修改 |
| 图例排列方向 | 图例文字的排列方向，可选择水平方向或垂直方向 |
| 图例水平位置 | 图例文字的水平位置，可选择图例位置为左侧对齐、右侧对齐或居中对齐 |
| 图例竖直位置 | 图例文字的竖直位置，可选择图例位置为顶部对齐、竖直居中或底部对齐 |
* 图例样式
* 图例设置演示
背景和边框
| 配置项 | 说明 |
|---|---|
| 背景和边框 | 开启后可显示标题背景和组件背景的设置功能 |
标题背景设置
| 配置项 | 说明 |
|---|---|
| 背景颜色 | 标题背景的颜色，支持修改 |
| 背景图片 | 标题背景照片，支持自定义选择 |
组件背景设置
| 配置项 | 说明 |
|---|---|
| 背景颜色 | 组件背景的颜色，支持修改 |
| 背景图片 | 组件的背景照片，支持自定义选择 |
* 标题与组件背景设置演示
标题底部边框设置
| 配置项 | 说明 |
|---|---|
| 底部边框线 | 标题底部边框的样式，可选择直线、虚线、点线或双实线 |
| 底部边框宽度 | 标题底部的边框宽度，支持修改 |
| 底部边框颜色 | 标题底部的边框颜色，支持修改 |
* 标题底部边框样式
组件边框设置
| 配置项 | 说明 |
|---|---|
| 边框线类型 | 组件边框的样式，可选择直线、虚线、点线或双实线 |
| 边框宽度 | 组件边框的宽度，支持修改 |
| 边框颜色 | 组件边框的颜色，支持修改 |
| 圆角 | 组件边框四个角的弧度，支持修改 |
* 标题底部边框和组件边框设置演示
组件阴影设置
| 配置项 | 说明 |
|---|---|
| 阴影宽度 | 组件阴影的宽度，默认为空，支持修改 |
| 阴影颜色 | 组件阴影的宽度，支持修改 |
| 阴影颜色X轴偏移 | 组件阴影颜色向X轴方向偏移距离，可修改 |
| 阴影颜色Y轴偏移 | 组件阴影颜色向Y轴方向偏移距离，可修改 |
* 组件阴影设置演示
图表配色
| 配置项 | 说明 |
|---|---|
| 图标渐变色 | 可为每个图例添加渐变色样式，增减图例时也可增加图例渐变色的设置数量 |
| 渐变色样式 | 每个渐变色样式对应每个图例，支持修改图例的渐变色以及渐变色角度和渐变色起始值、终止值 |
![图表配色样式]/img/statisticalchart/barLineChart/图表配色样式.png)
* 图表配色样式
Tooltip样式配置
**说明：**光标所在的的区域即可弹出提示框，提示该区域的数据情况
| 配置项 | 说明 |
|---|---|
| tooltip背景颜色 | tooltip提示框的背景颜色 |
| tooltip边框颜色 | tooltip提示框的边框颜色 |
| tooptip边框宽 | tooltip提示框的边框宽度 |
| tooltip内边距 | tooltip提示框内的提示内容距离边框的距离 |
| tooltip文字的颜色 | tooltip提示框内文字的颜色 |
| tooltip字体大小 | tooltip提示框内文字的大小 |
**注：**已开启tooltip轮播，若未开启需在预览中观看
- tooltip样式设置说明