返回 ppt-master
box_plot_chart.svg
根目录 / skills / ppt-master / templates / charts / box_plot_chart.svg
1 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720"
2 font-family="-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif"
3 font-size="12">
4 <!--
5 Box Plot Template
6 Usage: Data distribution visualization, statistical analysis
7 Scenarios: Salary distribution, grade analysis, quality control, outlier detection
8 Supports: 5 groups of box plot comparison
9 -->
10 <defs>
11 <!-- Box Gradient -->
12 <linearGradient id="boxGrad1" x1="0%" y1="0%" x2="0%" y2="100%">
13 <stop offset="0%" style="stop-color:#60A5FA;stop-opacity:1" />
14 <stop offset="100%" style="stop-color:#2563EB;stop-opacity:1" />
15 </linearGradient>
16 <linearGradient id="boxGrad2" x1="0%" y1="0%" x2="0%" y2="100%">
17 <stop offset="0%" style="stop-color:#34D399;stop-opacity:1" />
18 <stop offset="100%" style="stop-color:#059669;stop-opacity:1" />
19 </linearGradient>
20 <linearGradient id="boxGrad3" x1="0%" y1="0%" x2="0%" y2="100%">
21 <stop offset="0%" style="stop-color:#FBBF24;stop-opacity:1" />
22 <stop offset="100%" style="stop-color:#D97706;stop-opacity:1" />
23 </linearGradient>
24 <linearGradient id="boxGrad4" x1="0%" y1="0%" x2="0%" y2="100%">
25 <stop offset="0%" style="stop-color:#A78BFA;stop-opacity:1" />
26 <stop offset="100%" style="stop-color:#7C3AED;stop-opacity:1" />
27 </linearGradient>
28 <linearGradient id="boxGrad5" x1="0%" y1="0%" x2="0%" y2="100%">
29 <stop offset="0%" style="stop-color:#FB7185;stop-opacity:1" />
30 <stop offset="100%" style="stop-color:#E11D48;stop-opacity:1" />
31 </linearGradient>
32 </defs>
33 <!-- Background -->
34 <rect width="1280" height="720" fill="#FFFFFF"/>
35 <!-- Title -->
36 <g id="header" data-pptx-bounds="60 25 700 75">
37 <text x="60" y="55"
38 font-size="34" font-weight="bold" fill="#0F172A">Salary Distribution by Department</text>
39 <text x="60" y="90"
40 font-size="18" fill="#64748B">2025 Salary Report · Unit: 10K/Year</text>
41 </g>
42 <!-- Chart Area -->
43 <g id="box_plot_chart" data-pptx-bounds="30 110 970 500" data-pptx-replace-with="chart">
44 <metadata type="application/json">
45 {
46 "name": "box_plot_chart",
47 "x": 30,
48 "y": 122,
49 "width": 970,
50 "height": 471.75,
51 "type": "boxWhisker",
52 "series": [
53 {"name": "Tech", "values": [15, 25, 35, 45, 58, 8]},
54 {"name": "Product", "values": [12, 22, 28, 38, 50]},
55 {"name": "Design", "values": [10, 18, 24, 32, 42]},
56 {"name": "Marketing", "values": [8, 15, 22, 30, 45, 55]},
57 {"name": "Operations", "values": [8, 14, 20, 26, 38]}
58 ],
59 "style": {"colors": ["#3B82F6", "#10B981", "#F59E0B", "#8B5CF6", "#E11D48"]}
60 }
61 </metadata>
62 <g id="chartArea">
63 <!-- Y-axis Grid Lines -->
64 <line x1="140" y1="550" x2="1000" y2="550" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
65 <line x1="140" y1="480" x2="1000" y2="480" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
66 <line x1="140" y1="410" x2="1000" y2="410" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
67 <line x1="140" y1="340" x2="1000" y2="340" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
68 <line x1="140" y1="270" x2="1000" y2="270" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
69 <line x1="140" y1="200" x2="1000" y2="200" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
70 <line x1="140" y1="130" x2="1000" y2="130" stroke="#E0E0E0" stroke-width="1" stroke-dasharray="4,4"/>
71 <!-- Y-axis Labels -->
72 <text x="125" y="555"
73 font-size="13" fill="#64748B" text-anchor="end">0</text>
74 <text x="125" y="485"
75 font-size="13" fill="#64748B" text-anchor="end">10</text>
76 <text x="125" y="415"
77 font-size="13" fill="#64748B" text-anchor="end">20</text>
78 <text x="125" y="345"
79 font-size="13" fill="#64748B" text-anchor="end">30</text>
80 <text x="125" y="275"
81 font-size="13" fill="#64748B" text-anchor="end">40</text>
82 <text x="125" y="205"
83 font-size="13" fill="#64748B" text-anchor="end">50</text>
84 <text x="125" y="135"
85 font-size="13" fill="#64748B" text-anchor="end">60</text>
86 <!-- Y-axis Title -->
87 <text x="45" y="340"
88 font-size="15" fill="#475569" text-anchor="middle" transform="rotate(-90, 45, 340)">Annual Salary (10K)</text>
89 <!-- Axes -->
90 <line x1="140" y1="130" x2="140" y2="550" stroke="#94A3B8" stroke-width="2"/>
91 <line x1="140" y1="550" x2="1000" y2="550" stroke="#94A3B8" stroke-width="2"/>
92 <!--
93 Box Plot Description:
94 - Box width: 80px
95 - Box gap: 100px
96 - 100K = 70px
97 Data (Min, Q1, Median, Q3, Max):
98 Tech: 15, 25, 35, 45, 58 + Outlier 8
99 Product: 12, 22, 28, 38, 50
100 Design: 10, 18, 24, 32, 42
101 Marketing: 8, 15, 22, 30, 45 + Outlier 55
102 Operations: 8, 14, 20, 26, 38
103 -->
104 <!-- Box Plot 1: Tech (Blue) -->
105 <g id="box1" transform="translate(230, 0)">
106 <!-- Upper Whisker (max=58) -->
107 <line x1="0" y1="143.4" x2="0" y2="235" stroke="#2563EB" stroke-width="2"/>
108 <line x1="-20" y1="143.4" x2="20" y2="143.4" stroke="#2563EB" stroke-width="2"/>
109 <!-- Box (Q1=25 to Q3=45) -->
110 <rect x="-40" y="235" width="80" height="140" rx="4" fill="url(#boxGrad1)"/>
111 <!-- Median Line (median=35) -->
112 <line x1="-40" y1="305" x2="40" y2="305" stroke="#FFFFFF" stroke-width="3"/>
113 <!-- Lower Whisker (min=15) -->
114 <line x1="0" y1="375" x2="0" y2="445" stroke="#2563EB" stroke-width="2"/>
115 <line x1="-20" y1="445" x2="20" y2="445" stroke="#2563EB" stroke-width="2"/>
116 <!-- Outlier (outlier=8) -->
117 <circle cx="0" cy="494" r="6" fill="#FFFFFF" stroke="#2563EB" stroke-width="2"/>
118 <!-- Label -->
119 <text x="0" y="590"
120 font-size="15" font-weight="600" fill="#2563EB" text-anchor="middle">Tech</text>
121 <!-- Value Label -->
122 <text x="50" y="148"
123 fill="#64748B">58</text>
124 <text x="50" y="240"
125 fill="#64748B">45</text>
126 <text x="50" y="310"
127 fill="#3B82F6">35</text>
128 <text x="50" y="380"
129 fill="#64748B">25</text>
130 <text x="50" y="450"
131 fill="#64748B">15</text>
132 </g>
133 <!-- Box Plot 2: Product (Green) -->
134 <g id="box2" transform="translate(400, 0)">
135 <!-- Upper Whisker (max=50) -->
136 <line x1="0" y1="200" x2="0" y2="284" stroke="#059669" stroke-width="2"/>
137 <line x1="-20" y1="200" x2="20" y2="200" stroke="#059669" stroke-width="2"/>
138 <!-- Box (Q1=22 to Q3=38) -->
139 <rect x="-40" y="284" width="80" height="112" rx="4" fill="url(#boxGrad2)"/>
140 <!-- Median Line (median=28) -->
141 <line x1="-40" y1="354" x2="40" y2="354" stroke="#FFFFFF" stroke-width="3"/>
142 <!-- Lower Whisker (min=12) -->
143 <line x1="0" y1="396" x2="0" y2="466" stroke="#059669" stroke-width="2"/>
144 <line x1="-20" y1="466" x2="20" y2="466" stroke="#059669" stroke-width="2"/>
145 <!-- Label -->
146 <text x="0" y="590"
147 font-size="15" font-weight="600" fill="#059669" text-anchor="middle">Product</text>
148 </g>
149 <!-- Box Plot 3: Design (Orange) -->
150 <g id="box3" transform="translate(570, 0)">
151 <!-- Upper Whisker (max=42) -->
152 <line x1="0" y1="256" x2="0" y2="326" stroke="#D97706" stroke-width="2"/>
153 <line x1="-20" y1="256" x2="20" y2="256" stroke="#D97706" stroke-width="2"/>
154 <!-- Box (Q1=18 to Q3=32) -->
155 <rect x="-40" y="326" width="80" height="98" rx="4" fill="url(#boxGrad3)"/>
156 <!-- Median Line (median=24) -->
157 <line x1="-40" y1="382" x2="40" y2="382" stroke="#FFFFFF" stroke-width="3"/>
158 <!-- Lower Whisker (min=10) -->
159 <line x1="0" y1="424" x2="0" y2="480" stroke="#D97706" stroke-width="2"/>
160 <line x1="-20" y1="480" x2="20" y2="480" stroke="#D97706" stroke-width="2"/>
161 <!-- Label -->
162 <text x="0" y="590"
163 font-size="15" font-weight="600" fill="#D97706" text-anchor="middle">Design</text>
164 </g>
165 <!-- Box Plot 4: Marketing (Purple) -->
166 <g id="box4" transform="translate(740, 0)">
167 <!-- Upper Whisker (max=45) -->
168 <line x1="0" y1="235" x2="0" y2="340" stroke="#7C3AED" stroke-width="2"/>
169 <line x1="-20" y1="235" x2="20" y2="235" stroke="#7C3AED" stroke-width="2"/>
170 <!-- Box (Q1=15 to Q3=30) -->
171 <rect x="-40" y="340" width="80" height="105" rx="4" fill="url(#boxGrad4)"/>
172 <!-- Median Line (median=22) -->
173 <line x1="-40" y1="396" x2="40" y2="396" stroke="#FFFFFF" stroke-width="3"/>
174 <!-- Lower Whisker (min=8) -->
175 <line x1="0" y1="445" x2="0" y2="494" stroke="#7C3AED" stroke-width="2"/>
176 <line x1="-20" y1="494" x2="20" y2="494" stroke="#7C3AED" stroke-width="2"/>
177 <!-- Outlier (outlier=55) -->
178 <circle cx="0" cy="165" r="6" fill="#FFFFFF" stroke="#7C3AED" stroke-width="2"/>
179 <!-- Label -->
180 <text x="0" y="590"
181 font-size="15" font-weight="600" fill="#7C3AED" text-anchor="middle">Marketing</text>
182 </g>
183 <!-- Box Plot 5: Operations (Red) -->
184 <g id="box5" transform="translate(910, 0)">
185 <!-- Upper Whisker (max=38) -->
186 <line x1="0" y1="284" x2="0" y2="368" stroke="#E11D48" stroke-width="2"/>
187 <line x1="-20" y1="284" x2="20" y2="284" stroke="#E11D48" stroke-width="2"/>
188 <!-- Box (Q1=14 to Q3=26) -->
189 <rect x="-40" y="368" width="80" height="84" rx="4" fill="url(#boxGrad5)"/>
190 <!-- Median Line (median=20) -->
191 <line x1="-40" y1="410" x2="40" y2="410" stroke="#FFFFFF" stroke-width="3"/>
192 <!-- Lower Whisker (min=8) -->
193 <line x1="0" y1="452" x2="0" y2="494" stroke="#E11D48" stroke-width="2"/>
194 <line x1="-20" y1="494" x2="20" y2="494" stroke="#E11D48" stroke-width="2"/>
195 <!-- Label -->
196 <text x="0" y="590"
197 font-size="15" font-weight="600" fill="#E11D48" text-anchor="middle">Operations</text>
198 </g>
199 </g>
200 </g>
201 <!-- Legend Description -->
202 <g id="boxLegend" transform="translate(1040, 130)" data-pptx-bounds="1040 130 200 240">
203 <rect x="0" y="0" width="200" height="240" rx="8" fill="#F8F9FA" stroke="#E0E0E0" stroke-width="1"/>
204 <text x="100" y="28"
205 font-size="14" font-weight="600" fill="#0F172A" text-anchor="middle">Legend</text>
206 <line x1="15" y1="42" x2="185" y2="42" stroke="#E0E0E0" stroke-width="1"/>
207 <!-- Diagram -->
208 <g transform="translate(30, 60)">
209 <!-- Upper Whisker -->
210 <line x1="30" y1="0" x2="30" y2="25" stroke="#475569" stroke-width="2"/>
211 <line x1="20" y1="0" x2="40" y2="0" stroke="#475569" stroke-width="2"/>
212 <text x="70" y="5"
213 fill="#64748B">Max</text>
214 <!-- Box -->
215 <rect x="10" y="25" width="40" height="60" rx="3" fill="#CBD5E1"/>
216 <text x="70" y="35"
217 fill="#64748B">Q3 (75%)</text>
218 <!-- Median -->
219 <line x1="10" y1="55" x2="50" y2="55" stroke="#0F172A" stroke-width="2"/>
220 <text x="70" y="60"
221 fill="#0F172A">Median</text>
222 <text x="70" y="85"
223 fill="#64748B">Q1 (25%)</text>
224 <!-- Lower Whisker -->
225 <line x1="30" y1="85" x2="30" y2="110" stroke="#475569" stroke-width="2"/>
226 <line x1="20" y1="110" x2="40" y2="110" stroke="#475569" stroke-width="2"/>
227 <text x="70" y="115"
228 fill="#64748B">Min</text>
229 <!-- Outlier -->
230 <circle cx="30" cy="135" r="5" fill="#FFFFFF" stroke="#475569" stroke-width="2"/>
231 <text x="70" y="140"
232 fill="#F43F5E">Outlier</text>
233 </g>
234 <text x="15" y="220" fill="#94A3B8">IQR = Q3 - Q1<tspan x="15" dy="12">异常值 &gt; Q3+1.5*IQR</tspan></text>
235 </g>
236 <!-- Stats Summary -->
237 <g id="statsSummary" transform="translate(1040, 390)" data-pptx-bounds="1040 390 200 160">
238 <rect x="0" y="0" width="200" height="160" rx="8" fill="#ECFDF5" stroke="#10B981" stroke-width="1"/>
239 <text x="15" y="25"
240 font-size="13" font-weight="600" fill="#059669">📊 Stats Summary</text>
241 <text x="15" y="50" fill="#475569">Highest Median: Tech 350K<tspan x="15" dy="20">Lowest Median: Ops 200K</tspan><tspan x="15" dy="25">Widest Range: Tech</tspan><tspan x="15" dy="20">Narrowest Range: Ops</tspan></text>
242 <text x="15" y="140"
243 fill="#F43F5E">Outliers Found: 2</text>
244 </g>
245 <!-- Data Source -->
246 <g id="source" data-pptx-bounds="60 675 350 25">
247 <text x="60" y="695"
248 font-size="14" fill="#94A3B8">Data Source: HR Department Salary Statistics</text>
249 </g>
250 </svg>
251
251 lines Plain Text