Skip to Content

Wiki源代码5.8.2.3 饼状图

由用户 yinshi 在 2024/10/24 06:13 保存的版本 8.1
显示最后作者
1 ==== **【使用场景】** ====
2
3 饼状图是一种常用的数据可视化图表类型，它将数据呈现为一个类似于饼状的圆形，将不同数据分类的比例以扇形的方式展示出来，适用于以下一些场景：
4
5 * (((
6 **比例展示**： 饼状图适合展示不同类别在总体中的比例或占比关系。比如，市场份额、各种支出占总支出的比例等。
7 )))
8 * (((
9 **分类展示**： 饼状图可以将数据按照不同的类别进行分类展示，直观地展示各个类别之间的比较。比如，不同产品的销售比例、不同地区的销售占比等。
10 )))
11 * (((
12 **趋势分析**： 通过观察饼状图中各个扇形的大小变化，可以分析数据的趋势和变化情况。比如，销售额的季节性变化、不同年龄段用户的占比变化等。
13 )))
14 * (((
15 **重点突出**： 可以通过突出饼状图中某个扇形或几个重要的扇形，来强调特定的数据或类别。比如，突出某个产品的市场份额、突出某个地区的销售占比等。
16 )))
17
18 ==== **【基本要求】** ====
19
20 饼图的基本要求如下：
21
22 (% style="width:402px" %)
23 |(% style="width:175px" %)分类字段|(% style="width:225px" %)数值字段
24 |(% style="width:175px" %)最多1个字段|(% style="width:225px" %)最多1个字段
25
26 ==== **【操作步骤】** ====
27
28 **Step-1 选择组件，配置数据源**
29
30 创建报表，在左上角选择饼状图，然后选定数据源，如图：
31
32
33
34 **Step-2 选择图表展示字段**
35
36 将右边数据源中字段拖动放到**分类字段**、**数值字段**上
37
38 * (((
39 饼状图的数据源：
40
41 有了分类字段和数值字段，就可以根据数据的实际情况，绘制出正确的饼状图。下图中：将分类字段拖入销售物品类型，数值字段拖入销售数量，则可以得出：【按照销售物品类型分类后的销售数量的统计饼状图】
42
43
44 * (((
45 **分类字段：** 本字段表示数据的类别或分类，每个数据点都应该有一个对应的类别。类别字段可以是产品名称、地区名称、部门名称等，用于表示数据所属的具体类别。
46 )))
47 * (((
48 **数值字段：** 本字段表示每个类别的具体数值/数量。数值字段可以是销售额、销售数量、市场份额等，用于表示每个类别在总体中的比例或占比。
49
50 >
51
52 (((
53 ====== 如果在数值字段（虚线框）中拖入非数值类型的字段（如：字符串、日期、地点类型），会根据默认聚合方式（计数），将字符串、日期、地点转化为该字段出现的次数 ======
54 )))
55
56 [[image:1729749814387-113.png||height="669" width="1300"]]
57 )))
58 )))
59
60 **Step-3 样式设置**
61
62 分为三小类：【基础设置】、【标签】，【图例】，如下图：
63
64 [[image:1729750188515-947.png||height="766" width="1425"]]
65
66
67 (((
68
69 )))
70
71 (((
72
73
74
75 )))
76
77 ==== **【样式配置说明】** ====
78
79 |(% colspan="1" rowspan="1" %)(((
80
81 )))|(% colspan="1" rowspan="1" %)(((
82 样式设置分类
83 )))|(% colspan="1" rowspan="1" %)(((
84 配置项
85 )))|(% colspan="1" rowspan="1" %)(((
86 形态
87 )))|(% colspan="1" rowspan="1" %)(((
88
89 )))
90 |(% colspan="1" rowspan="18" %)(((
91 **饼状图**
92
93
94 )))|(% colspan="1" rowspan="9" %)(((
95 基础
96
97
98 )))|(% colspan="1" rowspan="1" %)(((
99 显示标题
100 )))|(% colspan="1" rowspan="1" %)(((
101 开关
102 )))|(% colspan="1" rowspan="1" %)(((
103 默认开启
104 )))
105 |(% colspan="1" rowspan="1" %)(((
106 标题名称
107 )))|(% colspan="1" rowspan="1" %)(((
108 输入框
109 )))|(% colspan="1" rowspan="1" %)(((
110 默认输入：饼状图
111 )))
112 |(% colspan="1" rowspan="1" %)(((
113 帮助文字
114 )))|(% colspan="1" rowspan="1" %)(((
115 开关
116 )))|(% colspan="1" rowspan="1" %)(((
117 默认关闭
118 )))
119 |(% colspan="1" rowspan="1" %)(((
120 帮助文字内容
121 )))|(% colspan="1" rowspan="1" %)(((
122 输入框
123 )))|(% colspan="1" rowspan="1" %)(((
124 占位提示：请输入
125 )))
126 |(% colspan="1" rowspan="1" %)(((
127 折线图类型
128 )))|(% colspan="1" rowspan="1" %)(((
129 选项卡
130 )))|(% colspan="1" rowspan="1" %)(((
131 默认选中“常规”，第二选项：环形图，环形图效果如下：
132
133
134
135 )))
136 |(% colspan="1" rowspan="1" %)(((
137 配色方案
138 )))|(% colspan="1" rowspan="1" %)(((
139 按钮或下拉
140 )))|(% colspan="1" rowspan="1" %)(((
141
142 )))
143 |(% colspan="1" rowspan="1" %)(((
144 启用导出
145 )))|(% colspan="1" rowspan="1" %)(((
146 开关
147 )))|(% colspan="1" rowspan="1" %)(((
148 默认打开
149 )))
150 |(% colspan="1" rowspan="1" %)(((
151 导出格式
152 )))|(% colspan="1" rowspan="1" %)(((
153 多选
154 )))|(% colspan="1" rowspan="1" %)(((
155 同柱状图
156 )))
157 |(% colspan="1" rowspan="1" %)(((
158
159 )))|(% colspan="1" rowspan="1" %)(((
160
161 )))|(% colspan="1" rowspan="1" %)(((
162
163 )))
164 |(% colspan="1" rowspan="6" %)(((
165 标签
166
167
168 )))|(% colspan="1" rowspan="1" %)(((
169 显示标签
170 )))|(% colspan="1" rowspan="1" %)(((
171 开关
172 )))|(% colspan="1" rowspan="1" %)(((
173 默认开启
174 )))
175 |(% colspan="1" rowspan="1" %)(((
176 颜色字号
177 )))|(% colspan="1" rowspan="1" %)(((
178 拾色器+下拉
179 )))|(% colspan="1" rowspan="1" %)(((
180 默认：黑色，12号字
181 )))
182 |(% colspan="1" rowspan="1" %)(((
183 连接线
184 )))|(% colspan="1" rowspan="1" %)(((
185 开关
186 )))|(% colspan="1" rowspan="1" %)(((
187 默认开启
188 )))
189 |(% colspan="1" rowspan="1" %)(((
190 标签位置
191
192
193 )))|(% colspan="1" rowspan="1" %)(((
194 选项卡
195 )))|(% colspan="1" rowspan="1" %)(((
196 内部，外部，蜘蛛图
197
198 标签在内部的样式示例：
199
200
201 标签为住蜘蛛图示例：
202
203
204
205 )))
206 |(% colspan="1" rowspan="1" %)(((
207 标签内容
208
209
210 )))|(% colspan="1" rowspan="1" %)(((
211 下拉
212
213
214 )))|(% colspan="1" rowspan="1" %)(((
215 是标题、百分比、值的各种排列组合，默认选择【标题，百分比】如下：
216
217
218
219 )))
220 |(% colspan="1" rowspan="1" %)(((
221 百分比小数位数
222 )))|(% colspan="1" rowspan="1" %)(((
223 下拉选择
224 )))|(% colspan="1" rowspan="1" %)(((
225 默认是2。
226
227
228
229 )))
230 |(% colspan="1" rowspan="3" %)(((
231 图例
232 )))|(% colspan="1" rowspan="1" %)(((
233 显示图例
234 )))|(% colspan="1" rowspan="1" %)(((
235 开关
236 )))|(% colspan="1" rowspan="1" %)(((
237 默认开启
238 )))
239 |(% colspan="1" rowspan="1" %)(((
240 图例位置
241 )))|(% colspan="1" rowspan="1" %)(((
242 八宫格
243 )))|(% colspan="1" rowspan="1" %)(((
244 默认选中：左上角。
245
246 注意：如果用户选中3点或9点这两个位置的时候， 图例需要**纵向**排列（如下图），其余位置是横向排列的。
247
248
249
250 )))
251 |(% colspan="1" rowspan="1" %)(((
252 颜色字号
253 )))|(% colspan="1" rowspan="1" %)(((
254 拾色器+下拉
255 )))|(% colspan="1" rowspan="1" %)(((
256 默认：黑色，12号字
257 )))