1.概述
1.1 应用场景
柱形图-面积图是由宽度相同的柱形的高度或长短来表示数据多少的柱形图，以及强调数量随时间而变化的程度的面积图，两者组合起来的一种组合图表类型。
柱形图-面积图适可以直观地表示数据量的大小并进行比较，可以比较明显地显示出各数据之间的比例差异，也可以显示部分与整体的关系。
柱形图-面积图展示效果如下图所示：
1.2 图表特点
优点：简单直观，不仅适合比较各组数据之间的差别，也能很好的展现沿某个维度的变化趋势，比较多组数据在同一个维度上的趋势。
1.3 应用实例
决策报表中可使用 组件复用 功能，下载安装组件后，直接替换数据即可快速复用组件样式，实现面积图-折线图的组合图效果。
更多面积图-折线图组合图的示例，可参见 帆软市场-组件 / 设计器→在线组件库。
| 组件下载链接 | 描述 | 效果图 |
|---|---|---|
| 面积图折线图组合-酷炫蓝 | 用于分析事物随时间或有序类别而变化的趋势 | |
2. 属性介绍
2.1 类型
以 单元格元素 或 悬浮元素 插入图表时，图表类型选择柱形图-面积图，如下图所示：
2.2 数据
柱形图-面积图需分别绑定柱形图、面积图的数据，数据绑定的详细介绍可以参见文档：图表数据。
2.3 样式
柱形图-面积图需分别设置柱形图、面积图的样式，基础样式设计可以参见文档：图表样式。
在图表样式通用功能的基础上，柱形图、面积图新增了堆积和坐标轴属性自定义设置，如下所示：
注：柱形图、面积图两者自定义设置项一致，此处介绍柱形图。
1）柱形图样式>坐标轴下新增添加坐标轴按钮，用户可新增其他的X、Y轴，并对新坐标的属性进行设置。
2）柱形图样式>系列下新增堆积和坐标轴功能，用户可自定义坐标轴的堆积属性和系列对应关系。
2.4 特效
柱形图-面积图特效设置的详细介绍可以参见文档：图表特效。
3. 示例
3.1 报表设计
3.1.1 准备数据
新建数据集ds1、ds2，数据库查询语句如下：
ds1：SELECT 产品名称, 订购量, 再订购量 FROM 产品 where 类别ID = 1
ds2：SELECT 产品名称, 库存量 FROM 产品 where 类别ID = 1
3.1.2 图表插入
合并一片区域单元格，右键选择 A1 单元格，选择单元格元素>插入图表>柱形图-面积图，如下图所示：
3.1.3 数据绑定
绑定柱形图-面积图数据，如下图所示：
3.1.4 样式设计
柱形图-面积图基础样式只需要改个标题，其余默认设置即可。
1）坐标轴自定义
柱形图-面积图属性面板的样式>坐标轴下新增添加坐标轴按钮，用户可新增其他的X、Y轴，并对新坐标的属性进行设置。
2）柱形图堆积自定义
新增的坐标轴需要对应到具体系列的值，样式>系列>柱形图下新增堆积和坐标轴功能，用户可自定义坐标轴的堆积属性和系列对应关系。
3）面积图堆积自定义
新增的坐标轴需要对应到具体系列的值，样式>系列>面积图下新增堆积和坐标轴功能，用户可自定义坐标轴的堆积属性和系列对应关系。
3.2 效果预览
3.2.1 PC 端
保存报表，点击分页预览，效果如下图所示：
3.2.2 移动端
4. 模板下载
已完成模板可参见：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\BasicChart\柱形图-面积图.cpt
点击下载模板：柱形图-面积图.cpt