หากพูดถึงการนำเสนอข้อมูลเชิงเปรียบเทียบ Column Chart หรือแผนภูมิแท่งแนวตั้ง คือหนึ่งในเครื่องมือที่ได้รับความนิยมมากที่สุดครับ ไม่ว่าจะเป็นในรายงานผลประกอบการ, สรุปยอดขายรายเดือน หรือการวิเคราะห์ข้อมูลทางสถิติ เพราะมันสามารถสื่อสารความแตกต่างของข้อมูลได้อย่างชัดเจนที่สุด
Column Chart คืออะไร?
Column Chart คือกราฟที่ใช้แท่งสี่เหลี่ยมแนวตั้งเพื่อแสดงค่าของข้อมูลในแต่ละหมวดหมู่ โดยความสูงของแท่งจะสัมพันธ์กับค่าของข้อมูลนั้นๆ แกนนอน (X-axis) มักใช้แทนหมวดหมู่หรือเวลา และแกนตั้ง (Y-axis) มักใช้แทนปริมาณหรือค่าตัวเลข
เมื่อไหร่ที่ควรเลือกใช้ Column Chart
- เปรียบเทียบระหว่างหมวดหมู่
เช่น ยอดขายของสินค้าแต่ละประเภท - แสดงการเปลี่ยนแปลงตามช่วงเวลา
เช่น จำนวนผู้เข้าชมเว็บไซต์ในแต่ละเดือน (หากจำนวนช่วงเวลาไม่มากเกินไป) - ข้อมูลที่มีค่าไม่ต่อเนื่อง (Discrete Data)
ข้อมูลที่แยกออกจากกันเป็นชุด ๆ ชัดเจน
เทคนิคการจัดเตรียมข้อมูล (Programming Logic)
ในการสร้าง Column Chart ผ่าน Library ต่างๆ (เช่น Chart.js หรือ ApexCharts) เรามักจะเตรียมข้อมูลในรูปแบบ Labels และ Datasets ดังนี้ครับ:
Plain Text
Plain Text
const config = {
type: 'bar',
data: {
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May'],
datasets: [{
label: 'Monthly Sales',
data: [65, 59, 80, 81, 56],
backgroundColor: 'rgba(54, 162, 235, 0.2)',
borderColor: 'rgb(54, 162, 235)',
borderWidth: 1
}]
}
};