历史版本10 :图表背景 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

图表背景是 图表样式 属性下的一个设置项,可以通过该设置项改变图表背景的显示样式和风格。

以模板 %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Advanced\Chart\ColumnChart\柱形图.cpt为例。

如下图,一张图表有四个不同区域的概念:整个图表区域(黑色框表示的范围)、绘图区(浅灰色背景表示的范围)、标题区(粉红色背景表示的范围)及图例区(淡黄色背景表示的范围)。
222

我们可以点击样式,来对这四个区域分别设置其边框、背景等属性,标题背景在 标题标签 里面,图例背景在 图例 里面,绘图区和图表区在背景标签里面,如下图所示:
image.png

1.2 功能介绍

图表背景包含:图表去设置和绘图区设置。

1)图表去设置

图表区设置:包含边框和背景两个内容设置,如下图:

image.png

2)绘图区设置:包含边框,背景,网格线,警戒线,间隔背景五个设置项,如下图:

image.png

2. 背景编辑

2.1 图表区

1)边框

通过边框样式可以给图表区最外延加上边框及设置边框颜色。

选中图表,在样式>背景>图表区中可以对边框进行设置。

  • 线型:可针对设置无,小,中,大四种线型。

  • 颜色:设置边框的颜色

  • 圆角:边框四个角的角度

默认所加的边框是棱角分明的,可设置圆角边框,并设置线型为绿色粗线型,就可以实现圆角绿色粗线型效果,如下图所示:

image.png

注:如设置图表边框,需要去除单元格的缩进,否则边框无法完全展示

2) 背景

可以对图表区设置背景填充,不透明度,阴影,如下图所示:

image.png

  • 填充:包含没有背景,颜色,图片,渐变色四个设置项。

  • 不透明度:可设置背景透明度,设置值为0-100,0表示完全透明,100表示完全不透明。

  • 阴影:可设置是否开启你阴影效果 ,默认关闭。

例:我们给它加上一个背景色,并设置透明度为 20%,此时效果如下图所示:

image.png

2.2 绘图区

绘图区样式设置分为五类:边框、背景、网格线、警戒线和间隔背景,其中边框和背景的设置与图表区的设置相同,这里不再赘述,下面详细讲解网格线、警戒线和间隔背景。

1) 网格线

选中图表,点击样式>背景>绘图区,可设置横向网格线和纵向网格线的颜色,将网格线都设为绿色,显示网格线,效果如下图所示:

image.png

2) 警戒线

选中图表,点击样式>背景>绘图区,添加警戒线,如下图所示设置:

image.png

警戒线设置:包含警戒线设置以及提示文字设置。

警戒线设置:

  • 警戒线显示位置:X 轴或者 Y 轴。

  • 警戒线值:公式填入。

  • 警戒线线型:依据实际要求选择合适线型

  • 警戒线颜色:根据要求自己选择。

提示文字设置:

  • 提示文字位置:显示在警戒线左边还是右边。

  • 提示文字内容:可公式输入内容。

  • 提示文字字体:选择何种字体。

  • 提示文字大小:使用字体的大小

  • 提示文字颜色:使用字体的颜色。

为了防止警戒线和警戒线标签被图形遮挡,影响用户阅读,警戒线图层位于图表最上层。效果如下图所示:
1567050365235364.png

3) 间隔背景

我们可以根据横纵坐标轴的网格线给绘图区添加间隔背景。

点击图表属性面板中图表属性表-样式>背景>绘图区,默认间隔设置横向间隔背景为绿色,效果如下图所示:

image.png

纵向设置和横向设置一致。

若需要每一间隔单独设置其背景,可选择自定义间隔背景设置方式,具体设置请参考 区域背景自定义