面积图

面积图又叫区域图。 它是在折线图的基础之上形成的, 它将折线图中折线与自变量坐标轴之间的区域使用颜色填充，这样一个填充区域我们叫做面积，颜色的填充可以更好的突出趋势信息。
和折线图一样，面积图也用于强调数量随时间而变化的程度，也可用于引起人们对总值趋势的注意。他们最常用于表现趋势和关系,而不是传达特定的值。
折线图和面积图都可以表示一段时间（或者有序分类）的趋势，相比之下面积图的表现力更强一些。

根据使用场景的不同。还可以细分为面积图、堆积面积图、百分比折面积图。

样式配置说明

面积图、堆积面积图、百分比面积图三种面积图的配置项一致，由X轴、Y轴、分组、对比基线、图例、图表样式、颜色7部分组成。

X轴

X轴用于配置面积图的X轴相关信息

Y轴

Y轴用于配置面积图的Y轴相关信息

分组

分组用于将数据进行分组，支持多个分组字段。会根据配置字段的取值生成不同颜色的曲线

对比基线

对比基线可设置一条基线，通过此基线可以清晰呈现数据与基线的差距。可以设置多个对比基线，一个基线可以设置其基线名称、颜色、基线类型、基线的值

图例

图例用于配置面积图图例相关信息

图表样式

图表样式用于配置面积图相关样式信息

颜色

颜色用于设置面积的颜色，支持选择颜色模板，即选择系统定义好的不同风格的配色方案，也支持修改单个面积的颜色。对于某些需要强调颜色的分组，可以自定义颜色，如error用红色表示

示例

面积图

1、查询最近30天的登录趋势图

repo="_internal"
| where action.name="login"
| bin _time span=1d
| stats count() as 登录总数 by _time
| sort by _time asc
| eval timetmp=toReadableTime(_time, "MM-dd")

• X轴选择timetmp，Y轴选择登录总数,绘制面积图
• Y轴的空值用0进行连接，表示此时没有登录情况
  

2、查询最近30天的登录趋势图，分别呈现出登录成功、失败的趋势。

repo="_internal"
| where action.name="login"
| eval response.statusName=if(response.statusName="OK","登录成功","登录失败")
| bin _time span=1d
| stats count() as cnt by _time,response.statusName
| sort by _time asc
| eval timetmp=toReadableTime(_time, "MM-dd")

• X轴选择 timetmp，Y轴选择cnt，选择response.statusName作为分组字段分别呈现登录成功和失败的趋势图。（一般来说，系统会自动识别 X 轴和 Y 轴字段，您也可以自行配置。）
• Y轴的空值用0进行连接，表示此时没有登录失败/成功的情况
• 添加图例，展示登录成功/失败的最大值和总数
  
• 设置对于登录失败预警的基线为2，能够更加清晰地看出哪些登录失败超过2次的情况
• 修改登录失败趋势的面积颜色为橙色，能够更加明显呈现登录失败情况
  

堆积面积图

查询最近30天的登录趋势图，分别呈现出登录成功、失败的趋势，同时能够呈现登录的总的次数。

repo="_internal"
| where action.name="login"
| eval response.statusName=if(response.statusName="OK","登录成功","登录失败")
| bin _time span=1d
| stats count() as cnt by _time,response.statusName
| sort by _time asc
| eval timetmp=toReadableTime(_time, "MM-dd")

• X轴选择timetmp，Y轴选择cnt，选择response.statusName作为分组字段分别呈现登录成功和失败的趋势图。（一般来说，系统会自动识别 X 轴和 Y 轴字段，您也可以自行配置。）
• Y轴的空值用0进行连接，表示此时没有登录失败/成功的情况
• 添加图例，展示登录成功/失败的最新值和总数
• 添加拐点为4px的圆，同时呈现值标签。更能清新呈现出每次登录成功和失败的次数
• 修改登录失败趋势的面积颜色为橙色，能够更加明显呈现登录失败情况
  

百分比面积图

查询最近30天的登录趋势图，分别呈现出登录成功、失败的趋势，同时能够呈现登录的总的次数。

repo="_internal"
| where action.name="login"
| eval response.statusName=if(response.statusName="OK","登录成功","登录失败")
| bin _time span=1d
| stats count() as cnt by _time,response.statusName
| sort by _time asc
| eval timetmp=toReadableTime(_time, "MM-dd")

• X轴选择timetmp，Y轴选择cnt，选择response.statusName作为分组字段分别呈现登录成功和失败的趋势图。（一般来说，系统会自动识别 X 轴和 Y 轴字段，您也可以自行配置。）
• Y轴的空值用0进行连接，表示此时没有登录失败/成功的情况
• 修改登录失败趋势的面积颜色为橙色，能够更加明显呈现登录失败情况