1.概述
1.1 应用场景
柱形图-折线图实际就是将 柱形图 和 折线图 两者组合起来的一种组合图表。常用于同时观察某个维度的数量、频率等指标，例如帕累托图。
帕累托图是将出现的质量问题和质量改进项目按照重要程度依次排列而采用的一种图表，遵循二八法则。
如下图所示帕累托图，想要改善员工离职情况，可从前三项入手：
1.2 图表特点
优点：简单直观，不仅适合比较各组数据之间的差别，也适合那些趋势比单个数据点更重要的数据集。
缺点：不适用于较大的数据集。
1.3 应用实例
决策报表中可使用 组件复用 功能，下载安装组件后，直接替换数据即可快速复用组件样式，实现柱形图-折线图组合图效果。
更多柱形图-折线图组合图的示例，可参见 帆软市场-组件 / 设计器→在线组件库。
| 组件下载链接 | 描述 | 效果图 |
|---|---|---|
| 帕累托图-青色系 | 1）用来识别消耗了最多资源的少部分因素的统计分析方法，遵循二八法则 2）帕累托图是进行优化和改进的有效工具，尤其应用在质量检测方面 | |
| 柱形折线组合图-酷炫蓝 | 1）柱形图与折线图组合后可以用柱形图比较数据大小 2）可以通过折线图查看数据变化趋势 | |
2. 示例
本文就以 1.1 节展示的帕累托图作为示例，介绍「柱形图-折线图」在 FineReport 中是如何应用的。
2.1 准备数据
点击设计器左上角「文件>新建普通报表」，新建内置数据集「员工离职原因统计分析」，如下图所示：
2.2 插入图表
合并一片单元格区域，点击上方工具栏插入图表按钮，插入「组合图>柱形图-折线图」。如下图所示：
2.3 设计柱形图
选中图表，点击右侧属性面板「单元格元素」，可设置图表的各个属性：类型、数据、样式、特效。
2.3.1 图表类型
选中图表所在单元格，点击右侧「单元格元素>类型」可查看和选择图表类型。
2.3.2 绑定数据
组合图需分别绑定图表的数据，柱形图和折线图的数据如下图所示：
2.3.3 设置样式
1）选中图表后，点击「单元格元素>样式>标题」，设置标题文本并设置标题居左显示。
2）设置「样式>图例」位置为靠上。
3）设置「样式>标签」，柱形图和折线图需分别设置：
柱形图
折线图：因为数据集中的占比使用的小数，所以标签勾选值，需要将格式修改为百分比。
4）设置「样式>系列」，系列的配色方案仅由系列决定，不按图表分开设置，系列其他设置均按图表分别设置。
注：想要单独修改折线或柱形的颜色，可直接修改配色方案中颜色，也可在「特效>条件属性」中改变系列的颜色。
柱形图
折线图
从系列的设置中我们看到，柱形图和折线图系列下都有一个「堆积和坐标轴」的设置项，默认柱形图和折线图使用的 Y轴 不同，柱形图使用的 Y轴，折线图使用的 Y轴2 。
注：根据实际情况，可设置两个图表使用同一个 Y轴；当一个图表包含的系列不止一个时，也可设置同个图表下不同系列使用不同 Y 轴。
5）设置「样式>坐标轴」，即可看到有 X轴、Y轴、Y轴2 三个坐标轴。点击右侧的增加按钮，还可新增新的坐标轴。详情可参见：图表坐标轴 。
本例仅设置 Y轴 和 Y轴2 ：
Y轴：本例数据集中「人数」字段总数为 256，这里自定义最大值为 250 ，便于数据观察与图表美观。
Y轴2：折线图的 Y轴2 实际最大值应为 1 即 100%，这里将最大值设置为 1.1 ，是为了图表显示更美观。另外轴标签本身显示为小数，所以需将轴标签格式改为百分比。
6）设置「样式>背景>绘图区」，将网格线设置为无。
2.4 效果预览
2.4.1 PC 端
保存报表，点击「分页预览」，效果如 1.1 节效果图所示。
2.4.2 移动端
App 端和 HTML5 端均支持，效果如下图所示：
2.5 应用扩展
更多柱形图-折线图组合的示例，可参见 帆软市场-组件 ，组件复用相关文档请参见：组件复用 。
| 组件链接 | 效果图 |
|---|---|
| 折线图柱形图组合-梦幻紫 | |
| 柱形折线组合图-梦幻紫 | |
3. 模板下载
已完成模板可参见：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\BasicChart\帕累托图.cpt
点击下载模板：帕累托图.cpt