กราฟแท่งแนวนอนHorizontal Bar Chart

01ภาพรวมของกราฟนี้

Horizontal bar chart คือกราฟแท่งที่สลับแกน ให้หมวดอยู่แกนตั้งและค่าอยู่แกนนอน การพลิกนี้แก้ปัญหาใหญ่ที่สุดของแท่งตั้งคือป้ายชื่อยาวที่ต้องเอียงจนอ่านลำบาก และยังเพิ่มจำนวนรายการได้มากโดยแค่เลื่อนหน้าลง

ใช้ที่ไหนบ้าง — จัดอันดับจังหวัด สินค้า สาเหตุของปัญหา หรือผลสำรวจที่ตัวเลือกเป็นประโยคยาว

สร้างอย่างไร

1. ขั้นที่ 1เรียงจากค่ามากไปน้อย
2. ขั้นที่ 2วางชื่อหมวดชิดขวาที่แกนตั้ง
3. ขั้นที่ 3วาดแท่งจากศูนย์ไปทางขวา
4. ขั้นที่ 4ติดค่าไว้ปลายแท่ง

02อธิบายภาษาคนเข้าใจง่าย ๆ

ปัญหาที่เจอบ่อยกับกราฟแท่งตั้งคือชื่อหมวดยาวเกินความกว้างของแท่ง พอชื่อชนกันก็ต้องเอียงป้าย 45 องศา ซึ่งทำให้คนอ่านต้องเอียงคอตามและอ่านช้าลงอย่างมาก

ทางแก้ง่ายที่สุดคือพลิกกราฟ 90 องศา ให้ชื่ออยู่ทางซ้ายในแนวนอนเหมือนอ่านรายการปกติ ส่วนแท่งยื่นไปทางขวา วิธีนี้ไม่เปลี่ยนความหมายของข้อมูลเลยแม้แต่น้อย แต่เปลี่ยนความเร็วในการอ่านอย่างมาก

ข้อดีอีกอย่างคือจำนวนรายการ แท่งตั้งเริ่มอึดอัดที่ประมาณ 8-10 หมวดเพราะความกว้างจอมีจำกัด แต่แท่งนอนเพิ่มได้ถึง 20-30 รายการโดยแค่ให้หน้าเลื่อนลง ซึ่งเป็นสิ่งที่ผู้อ่านคุ้นเคยอยู่แล้ว

เพราะรองรับรายการเยอะ กราฟแบบนี้จึงกลายเป็นเครื่องมือจัดอันดับโดยธรรมชาติ และเมื่อใช้จัดอันดับ การเรียงจากมากไปน้อยจึงเกือบจะเป็นข้อบังคับ เพราะคนอ่านคาดหวังว่ารายการบนสุดคืออันดับหนึ่ง

สิ่งที่ยังเหมือนเดิมทุกอย่างคือแกนค่าต้องเริ่มที่ศูนย์ การพลิกแกนไม่ได้ยกเว้นกฎข้อนี้ ภาพจำคือ ถ้าชื่อหมวดยาวกว่าประมาณหนึ่งคำ หรือมีเกิน 8 รายการ ให้พลิกเป็นแนวนอนไว้ก่อนเสมอ

03ข้อมูลที่ต้องใช้

คอลัมน์ที่ต้องเตรียม

ต้องเตรียมข้อมูลอย่างไรก่อนวาด

1. เรียงจากมากไปน้อย
2. ตัดสินใจว่าจะแสดง top N เท่าไร และบอกใน caption
3. รวมรายการเล็กเป็น "อื่น ๆ" ถ้าตัดออก

ค่าที่หายไป — รายการที่ไม่มีข้อมูลให้แสดงเป็นแถวว่างพร้อมคำว่า "ไม่มีข้อมูล" ห้ามตัดออกเงียบ ๆ เพราะผู้อ่านจะไม่รู้ว่ามันหายไป

สเกลของแกน — แกนค่าใช้ linear เสมอ ถ้าค่าต่างกันหลายเท่าจนแท่งท้าย ๆ มองไม่เห็น ให้เปลี่ยนไปใช้ dot-plot ที่รองรับสเกล log ได้

หน้าตาไฟล์ที่ต้องเตรียม

category,value
กรุงเทพฯ,502
เชียงใหม่,455
…

04อ่านแล้วเห็นอะไร

อ่านตามลำดับนี้

1. อ่านจากบนลงล่าง เพราะบนสุดคืออันดับหนึ่ง
2. หาจุดที่ความยาวลดลงฮวบ ๆ
3. เทียบรายการที่สนใจกับรายการบนสุด
4. ตรวจว่า caption บอกไหมว่าตัดเหลือ top เท่าไร

05เหมาะกับการนำเสนอแบบไหน

ทำอย่างไรให้คนอ่านได้ข้อสรุปโดยไม่ต้องบรรยาย

1. เน้นแถวที่เป็นของเราเองด้วยสีต่าง ให้ที่เหลือเป็นเทา
2. เขียนค่าไว้ปลายแท่งทุกแถวได้ เพราะแนวนอนมีที่ว่างพอ
3. ถ้าตัดเหลือ top N ให้เขียนไว้ใต้กราฟว่าตัดจากทั้งหมดกี่รายการ

06เอาไปใช้ต่อ

โค้ดทุกชิ้นอ่านไฟล์ horizontal-bar-sample.csv ชุดเดียวกับที่ Playground ใช้ และตัวเลขในโค้ดเปลี่ยนตามค่าที่คุณปรับด้านล่าง

# ติดตั้ง: pip install "matplotlib==3.10.*" "pandas==2.*"
# ดาวน์โหลด horizontal-bar-sample.csv จากหน้านี้ แล้ววางไว้ข้างสคริปต์
import matplotlib
matplotlib.use("Agg")   # รันแบบไม่มีหน้าจอ ถ้ารันในเครื่องตัวเองลบบรรทัดนี้ได้
import matplotlib.pyplot as plt
import pandas as pd

C1, C2, C3 = "#2a78d6", "#eb6834", "#1baf7a"   # palette ของคลัง เปลี่ยนเป็นสีองค์กรได้
INK, SURFACE = "#0b0b0b", "#fcfcfb"

df = pd.read_csv("horizontal-bar-sample.csv")
df["value"] = pd.to_numeric(df["value"], errors="coerce")
SORT = "value-desc"
LIMIT = 12   # ← ค่าจาก Playground

fig, ax = plt.subplots(figsize=(7.6, 4.2), facecolor=SURFACE)
ax.set_facecolor(SURFACE)

d = df.sort_values("value").tail(LIMIT)     # tail เพราะ barh วาดจากล่างขึ้นบน
bars = ax.barh(d["category"], d["value"], color=C1, height=0.7)
bars[-1].set_color("#eb6834")
ax.bar_label(bars, fmt="%.0f", padding=4, fontsize=9)
ax.set_xlim(0, None)
ax.set_xlabel("ยอดขาย (ล้านบาท)")
ax.set_title("อันดับยอดขายรายจังหวัด", loc="left")
ax.grid(axis="x", alpha=0.25); ax.set_axisbelow(True)

ax.spines[["top", "right"]].set_visible(False)   # ลดเส้นที่ไม่ได้ให้ข้อมูล
fig.tight_layout()
fig.savefig("horizontal-bar.png", dpi=160)
print("เขียน horizontal-bar.png แล้ว ·", len(df), "แถว")

ติดตั้ง: pip install "matplotlib==3.10.*" "pandas==2.*" · ทดสอบกับเวอร์ชัน 3.10

07ลองเล่นเพื่อเข้าใจ

ข้อควรระวัง

1. ไม่เรียงลำดับทั้งที่ใช้จัดอันดับ ทำให้คนอ่านต้องกวาดหาเอง
2. ตัดเหลือ top N โดยไม่บอกว่าตัดมาจากทั้งหมดเท่าไร
3. แกนค่าไม่เริ่มที่ศูนย์
4. ใส่รายการมากเกิน 30 จนต้องเลื่อนยาวและเทียบหัวท้ายไม่ได้
5. ใช้กับข้อมูลที่หมวดมีลำดับตามธรรมชาติอยู่แล้ว เช่น เดือน แล้วเรียงใหม่ตามค่าจนลำดับเดิมหาย

เมื่อไหร่ไม่ควรใช้กราฟนี้

• มีไม่เกิน 5 หมวดและชื่อสั้น→ใช้แทน: bar-chart แนวตั้งที่คนคุ้นเคยกว่า
• ค่าต่างกันหลาย order of magnitude→ใช้แทน: dot-plot บนสเกล log
• ต้องการเทียบสองช่วงเวลา→ใช้แทน: dumbbell-chart

กราฟที่เกี่ยวข้อง