วันอังคารที่ 3 กุมภาพันธ์ พ.ศ. 2558

Week #3


Try more web-based tools : Raphaël

ที่มารูปภาพ : ลิงก์

เกี่ยวกับ Raphael : (ราฟเพอล์)

เป็นเครื่องมือสำหรับวาด รูปร่างกราฟฟิคต่างๆ บน Web-Brower ในรูปแบบของ JavaScript Library คล้ายๆกับ Processing.js จึงง่ายต่อการนำไปประยุกค์ใช้บนเว็ปต่างๆ และก็เป็นทางเลือกอีกทางสำหรับ JavaScript Library

( ที่มา : http://raphaeljs.com/ )

การใช้งาน :

  1. เริ่มต้นต้อง Include -> Raphael.js จาก : ลิงก์ เข้ามาในไฟล์ HTML ของเร โดยที่ไฟล์ Raphael.js ต้องอยู่ใน Folder เดียวกับ index.html ของเรา

  2.  โครงร่างของ Code ที่สำคัญๆคือ window.onload() โดยที่ทุกอย่างจะอยู่ภายในส่วนนี้ จากนั้นจะเป็นคำสั่งต่าง ซึ่งสามารถศึกษาเพิ่มเติมได้จาก Document ของ Raphael ที่ ลิงก์
  3. ( Code แสดงตัวอย่างการใช้คำสั่งวาดรุปร่างพื้นฐานโดย Raphael Library )

ศึกษาการใช้งานเบื้องต้นเพิ่มเติมได้ที่ : https://www.youtube.com/watch?v=IPy77zMsd0Y

 

 ตัวอย่าง Demo การใช้งานรูปแบบต่างๆ :

แสดงรูปแบบการใช้งานในแบบต่างๆ



 ตัวอย่างเพิ่มเติมที่ : http://raphaeljs.com/ 

ทดลองวาด Line_Chart : Raphaeljs

  • ข้อมูลการเจริญเติบโตของต้นพืช A1, B10, C1, C7, E3 ในช่วงวันที่() 
  • ศึกษาอ้างอิงจาก



  

Find types/Structures not mentioned in lecture

Pyramid Chart :

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

กราฟแสดงปริมาณอาหารประเภทต่างๆ ที่ควรกินให้เหมาะสม




ไม่มีความคิดเห็น:

แสดงความคิดเห็น