Get Adobe Flash player

Monthly Archives: January 2019

HTML 5 canvas คืออะไร

HTML5 Canvas เป็นหนึ่งใน feature ที่มีคุณสมบัติทางด้านกราฟฟิคที่มาพร้อมกับ HTML5 ซึ่ง Canvas element นี่แหละมันอาจจะเป็นพระเอกของ HTML5 เพราะเจ้ากราฟฟิกตัวนี้ มันสามารถทำให้คุณสามารถสร้างระบบต่างๆ ที่คุณต้องการขึ้นมา ไม่ว่าจะเป็นระบบเกมส์ หรือโปรแกรมวาดภาพบนเว็บ ที่รองรับทุก platform

Canvas เป็น Element หนึ่งใน HTML5 เหมือนอย่าง <img> หรือ <a> โดยใน <img> หรือ <a> จะมี attributes เช่น src และ href แต่ใน <canvas> จะมีเพียงแค่ 2 attributes คือ width และ height (ความกว้างและความสูงของ Canvas) เท่านั้น

ข้อดีของ แท็ก Canvas
    ช่วยเปลี่ยนลูกเล่นการแสดงผลของเว็บเพจไปอีกมากเดิมที HTML เป็นการวาดออบเจคต์ (เช่น ข้อความ รูป กล่องข้อความ ฯลฯ) ขึ้นมาเป็นหน้าจอ และสามารถตกแต่งออบเจคต์แต่ละตัวได้ในระดับหนึ่งผ่าน CSS (เช่น ใส่สีพื้น วาดเส้นขอบ ทำมุมโค้ง) แต่ในภาพรวม HTML ยังไม่สามารถแสดงกราฟิกแบบราสเตอร์ (raster) ได้ด้วยตัวมันเอง ต้องทำภาพมาแปะอีกทอดหนึ่ง แท็ก canvas ที่ถูกเพิ่มเข้ามาช่วยให้เราสามารถ “วาดภาพ” ลงบนเว็บเพจได้โดยตรง โดยขอบเขตของภาพที่วาดก็จะอยู่ในออบเจคต์ชื่อ canvas นั่นเอง
   ลักษณะของ canvas แตกต่างจากภาพชนิดอื่นๆ คือ มันไม่ได้จะแสดงได้เป็นภาพนิ่งเท่านั้น แต่มันสามารถเป็นภาพเคลื่อนไหวได้ด้วย และก็ไม่ได้เกิดจากการเรียกไฟล์ภาพขึ้นมาแสดงตรงๆ แต่เป็นการสั่งโดย javascript ทุกๆเส้นหรือทุกๆจุด และทุกๆการเคลื่อนไหวที่เกิดภายใต้ <canvas> เกิดจากการสั่งงานโดย javascript ทั้งสิ้น แล้วนำเข้ามาโชว์ด้วยการเรียกผ่าน id ของ <canvas> เข้าไป

การใช้งาน HTML 5 canvas เบื้องต้น

เริ่มแรกทำการสร้างไฟล์ HTML ขึ้นมา ผมทำการตั้งชื่อ ว่า index.html และมี element <canvas> ดังตัวอย่าง


จากนั้นลิงค์สคริปไปยังไฟล์ JavaScript ของเรา โดยทำการตั้งชื่อว่า main.js

ตัวอย่างการทำ Canvas

ผลที่ได้ก็จะเหมือนๆกับเราสร้าง Element DIV แต่ว่าความสามารถของ Canvas นั้นมันมีมากกว่า และถ้าคลิกขวาที่ Canvas เราสามารถที่จะ Save ออกมาเป็น Image ได้ด้วยนะครับ

UNSIGNED ใน MySQL คืออะไร

ใน MySQL เมื่อเรากำหนด Datatype ที่เป็นตัวเลขจำนวนเต็ม อย่างเช่น INT จะมี attribute Unsigned ซึ่งเป็นตัวระบุว่าจะยอมให้มีค่าติดลบหรือไม่ ซึ่งก็คือ INT ปกติ จะมีค่าตั้งแต่ -2147483648 ถึง 2147483647 (ยอมให้ติดลบ) ส่วน INT Unsigned ที่ไม่มีค่าติดลบ จะมีค่าตั้งแต่ 0 ถึง 4294967295 (นำช่วงติดลบไปทบเป็นค่าบวกเพิ่ม)

วิธีการเลือกใช้

ให้พิจารณาว่าค่าใน Field หรือ Column นี้จะมีค่าติดลบหรือไม่ ถ้าไม่มีค่าติดลบเช่น “อายุ”  ก็ให้ใช้เป็นแบบ Unsigned ก็จะได้ช่วงเก็บข้อมูลเยอะขึ้น รวมทั้งป้องกันความผิดพลาด เพราะ Column นี้จะไม่ติดลบแน่ ๆ