可视化绘图技巧100篇进阶篇（八）-区域面积图（Area Chart）

最新推荐文章于 2024-12-22 12:00:00 发布
最新推荐文章于 2024-12-22 12:00:00 发布
阅读量426 收藏 1
点赞数
分类专栏： 可视化高级绘图技巧100篇 文章标签： 信息可视化
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/getusushu/article/details/132211187
版权
本文详述了区域面积图的适用场景、分类及其与其他图形的对比，如展示时间变化趋势、比较多组值。文章还探讨了标准面积图、堆叠面积图及其优缺点，并通过Python、R语言、Tableau等多个工具提供了代码实现示例，帮助理解如何绘制和应用面积图。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

目录

前言

适用场景

展示时间维度上变化的值

包含多组值

带有负值

不适用场景：面积图不适合不同分类之间的数值比较

区域面积图的分类

面积图的组成

标准面积图：

堆叠面积图：

图例

面积图与其他图形对比

面积图和折线图对比

面积图和柱状图对比

绘图工具及代码实现    

Python

matplotlib

 R语言

 Tableau

简单折线图

标准面积图

堆积面积图

百分比堆积面积图

亿图 

Highcharts

QtCharts

MATLAB

面积图相关函数

 面积图

指定区域面积填充

置信区间填充

悬挂填充折线图

双关系填充

绘制过水断面

单一区域法

堆叠区域法

JavaFX 

面积图X轴和Y轴

创建面积图

面积图数据系列

将面积图添加到场景图

 

前言

区域面积图（Area Chart）是一种常见的数据可视化图表，用于展示不同类别的数据随时间或其他变量的变化趋势，并强调每个类别在总体中所占的比例。区域面积图是由多个区域堆叠而成的图表，每个区域代表一个数据类别，沿着横轴表示时间或其他变量的维度。每个类别的数据值在纵轴上表示，区域的面积大小表示该类别数据在整体中的占比。

面积图又叫区域图。 它是在折线图的基础之上形成的, 它将折线图中折线与自变量坐标轴之间的区域使用颜色或者纹理填充，这样一个填充区域我们叫做面积，颜色的填充可以更好的突出趋势信息，需要注意的是颜色要带有一定的透明度，透明度可以很好的帮助使用者观察不同序列之间的重叠关系，没有透明度的面积会导致不同序列之间相互遮盖减少可以被观察到的信息。

和折线图一样，面积图也用于强调数量随时间而变化的程度，也可用于引起人们对总值趋势的注意。他们最常用于表现趋势和关系,而不是传达特定的值。

适用场景</

了解本专栏 订阅专栏 解锁全文
可视化绘图技巧100篇进阶篇（六）-三维饼图（3D Pie Chart）
getusushu的博客
08-13 587
（3D Pie Chart）是一种数据可视化图表，类似于普通的饼图，但在第三维度上增加了一定程度的立体效果，使得图表更加立体感。三维饼图将数据按比例分割成多个扇形区域，每个扇形表示一个数据类别，通过不同的半径和角度展示数据的分布情况，它通常用于显示数据的相对比例，特别适用于展示少数类别之间的相对大小关系。
可视化绘图技巧100篇进阶篇（十八）-鸡冠花图
getusushu的博客
03-11 79
南丁格尔玫瑰图，又名鸡冠花图、极坐标区域图，是南丁格尔在克里米亚战争期间提交一份关于士兵死伤报告时发明的一种图表，是在极坐标下绘制的柱状图。​。
R语言面积图 area chart
santiagozhang的博客
03-01 7750
简介 面积图展现了数值型变量随着另外一个变量变化的趋势。一般都是变量随时间的变化。面积图其实就是折线图，只是在线和X轴之间填满了颜色。面积图一般分为两种： 重叠面积图，显示各个数值随时间或类别变化的趋势。每一个数值分别显示。有的时候数值会被隐藏起来。 堆积面积图，各个数值堆积在一起显示总量。主要是part-to-whole的概念。不单单可以看出总量，而且可以看出每一个数值的对比和对总量的贡献。 ...
注释！注释！(1) - Area Chart
weixin_33807284的博客
03-25 196
我的目标是，注释100个d3.js的例子。 可能是史上最详细的 。 Area Chart是Basic Charts里的第一个例子。 解析 1 var margin = {top: 20, right: 20, bottom: 30, left: 50}, width = 960 - margin.left - margin....
做图篇：python面积图(Area Chart)
weixin_41297324的博客
01-21 9764
若有两种变量，且它们的值为离散的，那么二维相关图可以表示两个变量所有可能组合之间的相关性。当然如果是单变量，那么自身所有可能的组合也可以组成一个相关图。 import numpy as np import pandas as pd import matplotlib.pyplot as plt # Prepare Data df = pd.read_csv("https:...
数据可视化-11. 面积图、堆叠面积图、百分比堆叠面积图
一分耕耘一分收获
12-22 2317
面积图（Area Chart），又称区域图，是在折线图的基础上发展而来的。它将折线图中折线与自变量坐标轴（通常是X轴）之间的区域使用颜色或纹理进行填充，形成一个可以更好突出趋势信息的填充区域，即“面积”，适合展示数据的。此外，根据呈现方式的不同，面积图还可以分为二维面积图和三维面积图。面积图一般由以下几部分构成。
areachart
分享嵌入式,移动端,智能应用,数据库等专业板块,记录知识碎片！！！
11-10 399
pro文件配置 QT += charts 代码 /**************************************************************************** ** ** Copyright (C) 2016 The Qt Company Ltd. ** Contact: https://www.qt.io/licensing/ ** ** This file is part of the Qt Charts module of the Qt Toolki.
可视化高级绘图技巧100篇-总论
getusushu的博客
08-07 1581
优秀的数据可视化作品可以用三个关键词概括：准确、清晰、优雅。准确：精准地反馈数据的特征信息（既不遗漏也不冗余，不造成读者疏漏&误读细节）清晰：获取图表特征信息的时间越短越好优雅：美观（颜色搭配）、协调（相同场景的图表遵循统一规范）。想要准确、清晰的呈现数据，关键在于图表的选用，本专栏从下面几个维度来写可视化图表的使用技巧，希望能够帮助到各位。
​可视化绘图技巧100篇高级篇（四）-南丁格尔玫瑰图（一）
getusushu的博客
08-14 577
南丁格尔玫瑰图是弗罗伦斯·南丁格尔所发明的。又名为极区图。是一种圆形的直方图。南丁格尔自己常昵称这类图为鸡冠花图（coxcomb），并且用以表达军医院季节性的死亡率，对象是那些不太能理解传统统计报表的公务人员。长得像饼图又不是饼图，这种有着极坐标的统计图有着一个美丽的名字—。南丁格尔玫瑰图（Nightingale rose diagram）又名（Coxcomb Chart）或。
Area Chart
woaipaiqiu的专栏
08-26 765
  转载请注明出处: https://mp.youkuaiyun.com/postedit/82079912 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Title&lt;/title&gt; &amp
chartarea缩放_Google图表（AreaChart）如何检测缩放变化
weixin_39564527的博客
12-18 134
I am drawing an AreaChart, with some markers on an overlay.I am using the explorer option (horizontal only) in order to let the user zoom in and out.The problem is that I can't find a way to be notifi...
Android Canvas 自已绘面积图(Area Chart)
黑菜妞妞的专栏
01-29 2808
需要在图表上画一些不规则的面积图，参考了以下这篇博客，感觉不错！修改一下，可以用了！ 原文链接：http://blog.youkuaiyun.com/xcl168/article/details/23220197 本来当时只想做两个练练手后就快速越过Canvas的，对这块我一向兴趣不大，不过最近在绘了两个图后忽然发现，以前那些很常见的图 表，仔细想一下，如果不太讲求通用性，不考虑一些特效外，光图表本
【BizCharts】可视化图表使用（2）——面积图/Area
WinnieShen的博客
09-30 815
效果图 官方事例 我的实现 描述 坐标轴文字颜色、文字旋转 坐标轴线宽度、颜色 面积区域颜色 图例样式 去除网格线 实现 横坐标纵坐标颜色、字体、角度，配置Axis属性label label={{ rotate: 120, style: { fill: '#6fdfe1', fontSize: 10, }, }} 坐标轴线宽度、颜色，配置Axis属性line line={{ style: { lineWidth: 2, s
Echarts折线图之区域面积图
liuxi_happy的博客
11-04 3303
今天写echarts发现有个比较坑的地方，我使用了areaStyle 这个属性，把折线图设置成了如图的样式 但是客户想要的是如下图在这个样式 这里要敲重点了，想实现这个样式必须使用series-》line-》stack这个属性，这个属性会叠加数据，代码块如下 series:[ { type:"line", data:data1,（最小值） areaStyle:{ coloe:#000（这个颜色放你的背景色） }， stack:"confidence-band", }， {
数据可视化【六】Line Chart && Area Chart
T_T233333333的博客
08-18 853
Line Chart vizhub代码： https://vizhub.com/Edward-Elric233/094396fc7a164c828a4a8c2e13045308 实现效果： 这里先使用d3.line()设置每个点的x坐标和y坐标，然后再用这个东西设置path的'd'属性，就可以得到曲线。 const lineGenerator = d3.line() .x(d => xScale(xValue(d))) .y(d => yScale(yValue(d))) .
软件工程之数据流图和数据字典_实战PyQt5: 139-数据可视化之QChart面积图
weixin_39578513的博客
12-07 470
面积图(Area Chart)又称区域图，面积图强调数据随基线数据而变化的程度，也可用于引起人们对总值趋势的注意。例如，表示随时间而变化的利润的数据可以绘制在面积图中以强调总利润。在QChart中使用QAreaSeries来实现面积图的绘制。QAreaSeriesQAreaSeries类实现用面积图的方式显示数据。面积图用于显示定量数据。它根据高低两条边界线来确定面积区域。两条边界线之间的区域将被...
Echarts 设置面积区域图（areaStyle核心）
大剑师兰特的GIS世界
02-13 3122
在vue和echarts联合技术栈的操控下，本专栏提供行之有效的源代码示例。这里既包括样式的修改，又包括常用bug的解决。（1）提供title示例：展示控制标题的颜色、位置、子标题，连接等（2）提供legend示例：展示控制图例的类型、宽度、高度、位置、间隙，边框、阴影、透明度、偏移，字体、颜色，提示语等（3）提供grid示例：展示控制绘图网格的位置、宽度、高度、边框、阴影等（4）提供xAxis示例：展示控制x 轴的位置、类型、名称、字体、对齐方式、边框、阴影、宽度、高度等。
Chart控件，chart、Series、ChartArea曲线图绘制的重要属性介绍（Windows窗体）
qq_41867007的博客
04-20 6914
用chart控件有一段时间了，遇到卡壳的报错，正好也看到这篇博文（C# Chart控件，chart、Series、ChartArea曲线图绘制的重要属性_Andrewniu的博客-优快云博客_c# chartarea），自己来梳理一下： 一个chart可以绘制多个ChartArea，每个ChartArea都可以绘制多条Series。 ChartArea就是就是绘图区域，可以有多个ChartArea叠加在一起 series是画在ChartAarea上的，Series英文意思是“序列、连续”，其实就是数
曲线面积图AreaChartView
大城小小爱的博客
01-13 3337
//安卓中曲线面积图AreaChartView，多条曲线可以显示在一个表格中，自由设置宽高，和线的宽度 public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } }
python数据可视化项目Jupyter使用stackplot(）绘制堆积面积图 制有三个填充区域堆叠的堆积面积图
最新发布
03-11
### 使用 Jupyter Notebook 和 `matplotlib` 绘制堆积面积图 #### 简介 在 Python 数据可视化中，`matplotlib` 库是一个非常强大的绘图工具。通过 `stackplot()` 函数可以轻松地创建堆积面积图，用于展示多个数据序列随时间或其他连续变量的变化趋势，并直观显示它们之间的累积效果。 #### 步骤详解 接下来我们将演示如何在一个 Jupyter Notebook 中使用 `matplotlib.pyplot.stackplot()` 创建一个包含三个填充区域堆叠的堆积面积图： 1. **导入必要的库** 首先需要安装并引入所需的库。如果你还没有安装过 matplotlib 或者其他相关依赖项的话，则可以通过 pip 安装命令完成操作。 ```python import numpy as np import matplotlib.pyplot as plt %matplotlib inline ``` 2. **准备数据集** 为了方便演示，在这里我们构造一些示例性的随机数作为我们的三组数据源 x、y1、y2 和 y3 来代表不同时间段内的活动频率分布情况。 ```python # X轴坐标值 x = range(5) # Y轴对应的三条曲线的数据点 data1 = [7, 4, 9, 8, 6] data2 = [3, 5, 7, 5, 4] data3 = [1, 3, 2, 4, 5] labels=['Data Set 1', 'Data Set 2', 'Data Set 3'] colors=['r','g','b'] #颜色选择红绿蓝三种色彩标记每条线段 ``` 3. **绘制图形** 现在我们可以利用上面提到过的函数来画出最终的结果了: ```python plt.figure(figsize=(10,6)) # 调用 stackplot() 方法传入横纵坐标的数值列表以及标签信息等参数即可生成目标图表样式 plt.stackplot(x,data1,data2,data3, labels=labels, colors=colors) # 添加标题及轴名称 plt.title('Stacked Area Chart Example') plt.xlabel('X-axis') plt.ylabel('Y-axis') # 显示legend plt.legend(loc='upper left') plt.show() ``` 以上就是完整的流程说明啦～你可以直接复制粘贴到自己的 jupyter notebook 当中运行试试看哦！
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

格图素书

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值