วันอังคารที่ 27 มกราคม พ.ศ. 2558

Exercise 2 Chart-Graph web-based | Tool



Exercise 2 Chart-Graph web-based | Tool

  ใน Exercise 2 จะเป็นการทดลองใช้เครื่องมือเพิ่มเติมในการสร้าง Graph และ Chart โดยใช้เครื่องมือดังนี้

- Try one or more web-based tools
- Try Google Charts
- Find and try other tools

ตารางที่ 2.1 จำนวนมารดาตายต่อเกิดมีชีพ 100,000 คน ปี พ.ศ. 2544 - 2556  รายปี
   * หมายเหตุ : การตายของมารดา หมายถึง การตายของหญิงตั้งครรภ์หรือภายใน 24 วัน หลังสิ้นสุดการตั้งครรภ์ ไม่ว่าอายุครรภ์จะเป็นเท่าใดจากสาเหตุที่เกี่ยวข้องหรือก่อให้เกิดรุนแรงขึ้นจากครรภ์ หรือการดูแลรักษาขณะตั้งครรภ์และคลอด แต่ไม่ใช่จากอุบัติเหตุหรือสาเหตุที่เกี่ยวข้องกับการตั้งครรภ์

     


2.1 Try one or more web-based tools

- Plotly - https://plot.ly/

           Plotly เป็นอีกหนึ่ง web-based tools ที่มีให้ใช้งานซึ่งใช้งานได้ไม่ยากสะดวก มี Chart ให้เลือกสร้างหลายแบบตามรูปที่ 2.1.3 ถ้าไม่สมัครสมาชิกก่อนสามารถสร้าง Chart ได้ แต่จะไม่สามารถทำบางอย่างได้ เช่น import,export เป็นต้น 


รูปที่ 2.1.1 หน้าหาหลัก




รูปที่ 2.1.2 เมนูต่างๆ
  

รูปที่ 2.1.3 chart ที่อยู่ในเมนู MAKE A PLOT
                      ในรูปที่ 2.1.3 คือรูปแบบ Chart ให้เลือกว่าจะต้องการเลือกสร้างกราฟแบบใด ซึ่งทั้งหมดนี้อยู่ในเมนู MAKE A PLOT


     ทดลองใช้ Plotly โดยใช้ข้อมูลในตารางที่ 2.1

รูปที่ 2.1.4 แสดงข้อมูลในแบบ Column Chart
รูปที่ 2.1.4 แสดงข้อมูลในแบบ Line Chart



2.2 Try google charts

- Google Charts

           Google Charts ได้ถูกอออกแบบมาสำหรับใช้กับงานร่วมกับเว็ปไซต์ทั่วไป โดย Google Charts สามารถนำมาสร้าง Data visualization ได้หลากหลายรูปแบบ  ซึ่งใช้ภาษา Javascript ผนวกกับการนำ JS-API ของ Google มาใช้ในการเขียนโค้ด  เพื่อนำไปทำงานร่วมกับเว็ปไซต์

     ทดลองใช้ Google Chart โดยใช้ข้อมูลในตารางที่ 2.1

รูปที่ 2.2.1 แสดงข้อมูลในแบบ Column Chart


สามารถ Download ไฟล์ Column Chart ได้ที่นี่

รูปที่ 2.2.2 แสดงข้อมูลในแบบ Line Chart


สามารถ Download ไฟล์ Line Chart ได้ที่นี่



2.3 Find/try more tools

-VDraw (Freeware) < Download Here>

                    VDraw เป็นโปรแกรมวาดแบบ วาดรูป แบบครบวงจร ซึ่งหน้าที่หลักมันเป็นโปรแกรมวาดรูปแถมยังสามารถใช้ในการออกแบบบ้าน วาดแบบบ้าน แผนผังในแต่ละชั้นได้อย่างลงตัว เป็นโปรแกรมที่มีความสามารถเยอะมากๆ ในที่นี้โปรแกรม VDraw ยังสามารถช่วยในการสร้าง Chart อีกตัวหนึ่ง  ซึ่งมีให้เลือกทั้งแบบ 2D (รูปที่ 2.3.2) หรือ แบบ 3D (รูปที่ 2.3.3)

รูปที่ 2.3.1 รูปหน้าตาโปรแกรม
รูปที่ 2.3.2 Chart ใน 2D Chart
รูปที่ 2.3.3 Chart ใน 3D Chart

     ทดลองใช้ Online Chart tool โดยใช้ข้อมูลในตารางที่ 2.1
รูปที่ 2.3.4 แสดงข้อมูลในแบบ Column Chart
รูปที่ 2.3.5 แสดงข้อมูลในแบบ Line Chart

วันอังคารที่ 20 มกราคม พ.ศ. 2558

Infographic vs. Data Visualization

Infographic vs. Data Visualization

 Infographic

        Infographic ย่อมาจาก Information Graphic คือ ภาพหรือกราฟิกซึ่งบ่งชี้ถึงข้อมูล ไม่ว่าจะเป็นสถิติ ความรู้ ตัวเลข ฯลฯ เรียกว่าเป็นการย่นย่อข้อมูลเพื่อให้ประมวลผลได้ง่ายเพียงแค่กวาดตามอง ซึ่งเหมาะสำหรับผู้คนในยุคไอทีที่ต้องการเข้าถึงข้อมูลซับซ้อนมหาศาลในเวลา อันจำกัด ( เหตุผลเพราะมนุษย์ชอบและจดจำภาพสวยๆ ได้มากกว่าการอ่าน )  และในปัจุบันกำลังเป็นที่นิยมในโลกของ Social Netword
       ประโยชน์และพลังของ Infographic นั้นมีอยู่มากมาย เพราะด้วยแผนภาพสวยๆนี้ สามารถทำให้คนทั่วๆไปสามารถเข้าถึง เข้าใจ ข้อมูลปริมาณมากๆ ด้วยแผนภาพภาพเดียวเท่านั้น ด้วยข้อมูลที่ถูกคัดกรองมาเป็นอย่างดี ทำให้ผู้อ่านเข้าใจได้ง่าย เป็นวิธีการนำเสนอข้อมูลเชิงสร้างสรรค์ ซึ่งเราสามารถหยิบยกเรื่องราวเล็กๆ ไปจนถึงเรื่องราวใหญ่โตมานำเสนอ ในมุมมองที่แปลกตา ทันสมัย ทันต่อเหตุการณ์ในโลกปัจจุบัน  โดยรูปแบบหรือประเภทของ Infographic ตามวัตถุประสงค์ในการใช้งาน
รูปตัวอย่าง Infographics : ก๋วยเตี๋ยวในสวน


 Data Visualization

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


          

Exercise 1 - Chart | Graph Generator | Tool


 Exercise 1 Chart | Graph Generator | Tool

  ใน Exercise 1 จะเป็นการทดลองใช้เครื่องมือสร้าง Graph และ Chart โดยใช้ข้อมูลง่ายๆ โดยใช้เครื่องมือดังนี้

- use spreadsheet to create graph/chart
- use processing.js
- Find and try other tools

    ในที่นี้ จะยกตัวอย่างเป็น ตารางรายจ่าย ใน 1 สัปดาห์ โดยเริ่มจากวันอาทิตย์ ตามตารางในรูปที่ 1.1

 
รูปที่ 1.1 ตารางรายจายใน 1 สัปดาห์

1.1 Spreadsheet

- Microsoft Excel 2010

รูปที่ 1.1.1 Microsoft Excel 2010
             Microsoft Excel เป็นโปรแกรมประเภทสเปรดชีต (spreadsheet) หรือโปรแกรมตารางทำงานซึ่งใช้เก็บข้อมูลต่าง ๆ สูตรคำนวณ ลงบนแผ่นตารางงานคล้ายกับการเขียนข้อมูลลงไปในสมุดที่มีการตีช่องตารางทั้งแนวนอนและแนวตั้ง ปัจจุบันโปรแกรมตารางทำงาน  มีความสามารถ 3 ด้าน คือ  คำนวณ  นำเสนองานด้วยกราฟและแผนภูมิ จัดการฐานข้อมูล
         
     ทดลองใช้ Microsoft Excel โดยใช้ข้อมูลในรูปที่ 1.1

รูปที่ 1.1.2 แสดงข้อมูลในแบบ Column Chart
 
รูปที่ 1.1.3 แสดงข้อมูลในแบบ Line Chart

รูปที่ 1.1.4 แสดงข้อมูลในแบบ Pie Chart
 
รูปที่ 1.1.5 แสดงข้อมูลในแบบ Bar Chart




1.2 Processing.js

- Processing.js

           Processing.js  ได้ถูกอออกแบบมาสำหรับใช้กับงานร่วมกับเว็ปไซต์ทั่วไป โดยไม่ต้องลงอะไรเพิ่มเติม โดย Processing.js สามารถนำมาสร้าง Data visualization, Digital art, Charts และอื่นๆอีกมากมาย   ซึ่งใช้ภาษา Processing ในการเขียนโค้ด เพื่อนำไปทำงานร่วมกับเว็ปไซต์

     ทดลองใช้ Processing.js โดยใช้ข้อมูลในรูปที่ 1.1

รูปที่ 1.2.1 แสดงข้อมูลในแบบ Pie Chart

Download this




1.3 Other Tool

- Online Chart Tool 

       
             Online Chart Tool เป็นเว็บแอปพลิเคชั่นที่ช่วยในการสร้าง Chart อีกตัวหนึ่ง ซึ่งใช้งานได้ไม่ยากไม่ต้องลงอะไรเพิ่มเติม สามารถใช้งานได้เลยผ่าน Web Browser ได้เลย เมื่อสร้าง Chart เสร็จ สามารถ Save หรือ Share ได้เลย โดยการ Save จะมีหลายแบบให้เลือก ดังรูปที่ 1.3.1

รูปที่ 1.3.1 รูปแบบการ save and share


รูปที่ 1.3.2 Online Chart Tool

     ทดลองใช้ Online Chart tool โดยใช้ข้อมูลในรูปที่ 1.1

 
รูปที่ 1.3.3 แสดงข้อมูลในแบบ Column Chart

รูปที่ 1.3.4 แสดงข้อมูลในแบบ Line Chart

 
รูปที่ 1.3.5 แสดงข้อมูลในแบบ Pie Chart

รูปที่ 1.3.6 แสดงข้อมูลในแบบ Bar Chart