กราฟแท่งสองทางDiverging Bar Chart

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

Diverging bar chart ย้ายเส้นฐานจากขอบมาไว้กลางภาพ แท่งที่ค่าเป็นบวกยื่นไปทางหนึ่ง ค่าติดลบยื่นไปอีกทาง ทำให้ "ทิศทาง" กลายเป็นสิ่งที่เห็นก่อนขนาด ซึ่งตรงกับคำถามที่กราฟนี้ตอบพอดี คือใครดีขึ้นใครแย่ลง

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

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

1. ขั้นที่ 1เลือกเส้นฐานที่มีความหมาย เช่น ศูนย์ ค่าเฉลี่ย หรือเป้าหมาย
2. ขั้นที่ 2คำนวณส่วนต่างจากเส้นฐาน
3. ขั้นที่ 3เรียงตามส่วนต่าง
4. ขั้นที่ 4ใช้สีสองขั้วที่มีเทาเป็นจุดกลาง

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

เวลาข้อมูลมีทั้งค่าบวกและค่าลบ กราฟแท่งธรรมดาจะอ่านยาก เพราะแท่งของค่าลบต้องห้อยลงจากเส้นฐานที่อยู่กลาง ๆ และคนอ่านต้องคอยดูเครื่องหมายกำกับ

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

หัวใจอยู่ที่การเลือกเส้นฐาน ซึ่งไม่จำเป็นต้องเป็นศูนย์เสมอไป อาจเป็นค่าเฉลี่ยของทั้งกลุ่ม เป้าหมายที่ตั้งไว้ หรือค่าของปีก่อน แต่ไม่ว่าเลือกอะไร ต้องเขียนบอกให้ชัดว่าเส้นกลางคืออะไร

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

สิ่งที่ต้องระวังคือ กราฟนี้ทำให้ความต่างเล็ก ๆ ดูใหญ่ เพราะแท่งสองฝั่งรวมกันเป็นระยะทางสองเท่า ถ้าค่าจริงต่างกันแค่ 1-2% แต่ภาพดูเหมือนคนละโลก ควรใส่สเกลให้ชัดหรือเปลี่ยนไปใช้กราฟอื่น

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

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

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

1. เลือกและระบุเส้นฐานให้ชัดเจน
2. คำนวณส่วนต่างจากเส้นฐาน
3. เรียงจากบวกมากที่สุดไปลบมากที่สุด
4. ตัดสินใจว่าจะใช้ส่วนต่างสัมบูรณ์หรือเปอร์เซ็นต์

ค่าที่หายไป — รายการที่คำนวณส่วนต่างไม่ได้ต้องแยกออกและระบุ ห้ามถือว่าเป็นศูนย์ เพราะศูนย์แปลว่า "เท่ากับเส้นฐานพอดี" ซึ่งเป็นข้อมูลคนละอย่าง

สเกลของแกน — linear และควรให้สองฝั่งกว้างเท่ากันเพื่อไม่ให้ฝั่งใดดูใหญ่กว่าโดยผลของการจัดหน้า

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

category,value
…

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

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

1. หาเส้นกลางก่อนและอ่านว่ามันคืออะไร
2. ดูว่าฝั่งไหนมีแท่งมากกว่า
3. ดูแท่งที่ยาวที่สุดของทั้งสองฝั่ง
4. ตรวจว่าสเกลสองฝั่งเท่ากัน

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

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

1. เขียนชัดเจนว่าเส้นกลางคืออะไร เช่น "เทียบกับเป้า" หรือ "เทียบกับปีก่อน"
2. ใช้สีบอกขั้วอย่างเดียว ห้ามใช้สีบอกหมวดหมู่ปนกัน
3. ติดตัวเลขไว้ปลายแท่งพร้อมเครื่องหมายบวกลบให้ชัด

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

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

# ติดตั้ง: pip install "matplotlib==3.10.*" "pandas==2.*"
# ดาวน์โหลด diverging-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("diverging-bar-sample.csv")
df["value"] = pd.to_numeric(df["value"], errors="coerce")
SORT = "value-desc"   # ← ค่าจาก Playground

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

d = df.sort_values("value")
colors = ["#2a78d6" if v < 0 else "#e34948" for v in d["value"]]   # สองขั้วที่รู้สึกตรงข้ามกัน
ax.barh(d["category"], d["value"], color=colors, height=0.72)
ax.axvline(0, color=INK, linewidth=1.4)
lim = d["value"].abs().max() * 1.15
ax.set_xlim(-lim, lim)                 # สองฝั่งกว้างเท่ากัน ไม่ให้ฝั่งใดดูรุนแรงกว่า
ax.set_xlabel("ส่วนต่างจากเป้าหมาย")
ax.grid(axis="x", alpha=0.25); ax.set_axisbelow(True)

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

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

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

ข้อควรระวัง

1. ไม่บอกว่าเส้นกลางคืออะไร ทำให้ตีความส่วนต่างผิดได้ทั้งหมด
2. ใช้สเกลสองฝั่งไม่เท่ากัน ทำให้ฝั่งหนึ่งดูรุนแรงเกินจริง
3. ใช้กับข้อมูลที่ค่าทั้งหมดอยู่ฝั่งเดียว ซึ่งไม่ได้อะไรเพิ่มจากกราฟแท่งธรรมดา
4. ใช้สีที่ไม่สื่อความตรงข้าม หรือใส่สีสดที่จุดกลางแทนที่จะเป็นเทา
5. ลืมว่ากราฟนี้ซ่อนค่าสัมบูรณ์ไว้ — ส่วนต่างเท่ากันอาจมาจากฐานที่ต่างกันมหาศาล

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

• ค่าทั้งหมดเป็นบวก→ใช้แทน: horizontal-bar
• ข้อมูลเป็นสเกลความเห็นที่มีลำดับ→ใช้แทน: sentiment-diverging ที่จัดกึ่งกลางที่ความเห็นกลาง
• ต้องการเห็นค่าก่อนและหลังทั้งคู่→ใช้แทน: dumbbell-chart

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