Data Visualization: Data Visualization Week 2 :: web-based tool & google chart

Data Visualization Week 2

ข้อมูลที่นำมาใช้ในการทดลองในครั้งนี้นั้นเป็นข้อมูลของ อัตราผู้ป่วยโรคสำคัญต่อหนึ่งแสนคน ในปี ค.ศ.2012 และ ปี ค.ศ.2013

Use google chart

เป็นการเขียนโค้ดเพื่อสร้าง chart โดยการใช้ script ของทาง google chart ซึ่งทางเว็บนั้นได้มีโค้ดตัวอย่างไว้ให้สำหรับผู้เริ่มใช้ได้ทดลองกันด้วย ดังตัวอย่างการสร้างกราฟแท่งในครั้งนี้ได้มีการนำโค้ดของทาง google chart มาประยุกต์ใช้ (https://developers.google.com/chart/interactive/docs/quick_start) ซึ่งทางเว็บได้แนะนำมาว่าหากผู้ใช้ต้องการสร้างสร้าง Pie chart ให้เรียกใช้ด้วยคำสั่ง google.visualization.PieChart แต่หากต้องการสร้าง Bar chart ให้เรียกใช้ด้วยคำสั่ง google.visualization.BarChart แทน

CODE ที่ใช้ในการสร้างกราฟ

ผลที่ได้จากการทดลอง

Use web-based tool

plot.ly : http://plot.ly/

ในส่วนของ plot.ly นั้นผู้ใช้ต้องทำการสมัครสมาชิกก่อนจึงจะสามารถเข้าใช้งานได้
ขั้นตอนที่ 1 ทำการ add ข้อมูลลงในตาราง กำหนดว่าข้อมูลชุดไหนอยู่แนวแกน X, แกน Y รวมทั้งกำหนดรูปแบบของ chart ที่ต้องการใช้ในการแสดงข้อมูล เช่น Bar chart , Pie chart เป็นต้น

ขั้นตอนที่ 2 กำหนดสีกำหนดรูปแบบของการฟ

ขั้นตอนที่ 3 เมื่อได้กราฟตามความต้องการแล้วผู้ใช้สามารถ Export ออกไปใช้งานได้เลย

ภาพแสดงกราฟที่ได้จากการทดลอง

Datawrapper : https://datawrapper.de/

ในส่วนของ Datawrapper นั้นจะมีขั้นตอนการสร้าง chart ง่ายๆอยู่ 4 ขึ้นตอน

ขั้นตอนที่ 1 ทำการ add ข้อมูล ซึ่งในที่นี้ผู้ใช้สามารถใส่ข้องมูลเป็นแบบ text หรือแบบ CSV file ก็ได้

ขั้นตอนที่ 2 ตรวจสอบข้อมูลว่าถูกต้องหรือไม่ อีกทั้งยังสามารถกำหนดข้อมูลต่างๆ อย่างเช่นหน่วยของตัวเลขได้อีกด้วย

ขั้นตอนที่ 3 ทำการเลือกรูปแบบกราฟที่ต้องการ ซึ่งผู้ใช้สามารปรับแต่งรูปแบบของ chart ได้

ภาพแสดงกราฟที่ได้จากการทดลอง

ขั้นตอนที่ 4 เป็นขั้นตอนของการ Publish & Embed ซึ่งในบางกรณีนั้นจะต้องทำการอัพเกรดก่อน (เสียค่าบริการ)

Raw : http://raw.densitydesign.org/
Raw เป็น web based ตัวหนึ่งที่ผู้ใช้สามารถลองเล่นได้โดยไม่ต้องสมัครสมาชิกให้ยุ่งยาก ซึ่งขั้นตอนในการใช้นั้นก็ไม่ได้ต่างจาก web based ตัวอื่นๆเท่าใดนัก

เริ่มแรกจากการใส่ข้อมูลลงไป

จากนั้นก็ทำการเลือกรูปแบบ chart ตามแบบที่ผู้ใช้ต้องการ

จัดการข้อมูลตามรูปแบบที่ผู้ใช้ต้องการให้แสดงผลบนกราฟ

ทำการปรับขนาด ปรับสี ของ chart

chart ที่ได้จากการทดลอง

สามารถนำ chart ที่ได้ออกไปใช้ในรูปแบบของ Embed code ได้

Many eyes : http://ibm.com/software/analytics/manyeyes การสร้างกราฟใน web based ของ Many eyes นั้นสามารถทำได้ภายในสามขั้นตอนเท่านั้น นั่นคือ ใส่ข้อมูลสำหรับสร้าง chart => เลือกรูปแบบและปรับเปลี่ยน chart ตามที่ต้องการ => share!

ขั้นตอนที่ 1 ผู้ใช้ต้องทำการ add ข้อมูลลงไป เมื่อทำการใส่ข้อมูลเรียบร้อยแล้วทางเว็บจะมีการแสดงข้อมูลให้เราดูแบบเป็นตารางอีกด้วยซึ่งนั่นจะทำให้ผู้ใช้สามารถตรวจสอบข้อมูลได้ง่ายขึ้น