การวาดรูปภาพด้วย KineticJS

เพื่อที่จะสร้างรูปทรงหลายเหลี่ยมด้วย KineticJS นั้น  เราจะใช้ Kinetic.Image()ครับ. ตัวอย่าง แทคที่ใช้ ตัวอย่าง : วาดรูปทรงหลายเหลี่ยม ...

Read More

การวาดรูปทรงหลายเหลี่ยมด้วย KineticJS

เพื่อที่จะสร้างรูปทรงหลายเหลี่ยมด้วย KineticJS นั้น  เราจะใช้ Kinetic.Polygon() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดู...

Read More

การวาดเส้นด้วย KineticJS

เพื่อที่จะสร้างเส้นด้วย KineticJS นั้น  เราจะใช้ Kinetic.Line() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดูได้จากที่นี่ครับ...

Read More

การวาดรูปทรงลิ่มด้วย KineticJS

เพื่อที่จะสร้างรูปทรงลิ่มด้วย KineticJS นั้น  เราจะใช้ Kinetic.Wedge() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดูได้จากที่...

Read More

การวาดรูปทรงวงรีด้วย KineticJS

เพื่อที่จะสร้างรูปทรงวงรีด้วย KineticJS นั้น  เราจะใช้ Kinetic.Ellipse() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดูได้จากท...

Read More

การวาดรูปทรงวงกลมด้วย KineticJS

เพื่อที่จะสร้างรูปทรงวงกลมด้วย KineticJS นั้น  เราจะใช้ Kinetic.Circle() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดูได้จากท...

Read More

การวาดรูปทรงสี่เหลี่ยมด้วย KineticJS

เพื่อที่จะสร้างรูปทรงสี่เหลี่ยมด้วย KineticJS นั้น  เราจะใช้ Kinetic.Rect() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดูได้จ...

Read More

การวาดไม้บรรทัดด้วย KineticJS

ช่วงนี้กำลังเขียนโปรแกรมโดยใช้ HTML5(canvas) ในการพัฒนาเครื่องมือวาดรูปทรงต่างๆ อยู่ครับ โดยตัว editor ตัวนี้มีหลายๆ feature ด้วยกันหนึ่งในน...

Read More

KineticJS คืออะไร

หมายเหตุ:  KineticJS ไม่มีการ supportแล้ว  ย้ายไปโครงการใหม่ชื่อ  KonvaJS KineticJS คือ  HTML5 Canvas JavaScript framework เป็น framework...

Read More

การสร้างข้อความใน Canvas (HTML5)

การสร้างข้อความ การสร้างข้อความใน HTML5 Canvas เราใช้เมธอด font และ fillText() ของ canvas context. การกำหนดค่าจำพวก ฟอนต์, ขนาด, หรือรูปแบบ...

Read More

การวาดรูปภาพใน Canvas (HTML5)

การวาดรูป การวาดรูปภาพใน HTML5 Canvas เราจะใช้เมธอด drawImage(imageObj, x , y) ครับโดยมรา imageObj คือรูปที่จะมาวาด ส่วน x,y คือตำแหน่งของ...

Read More

การระบายสีให้รูปทรงต่างๆใน Canvas (HTML5)

การระบายสีแบบทั่วไป เพื่อที่จะเติมสีให้กับรูปทรงต่างๆใน  HTML5 Canvas เราจะใช้เมธอด fillStyle โดยจะใช้เป็นข้อความระบุสี เช่น blue หรือใช้รู...

Read More

การวาดรูปทรงต่างๆใน Canvas (HTML5)

การวาดรูปทรงแบบ Custom การสร้างรูปทรงแบบ custom ด้วย HTML5 Canvas เราใช้การสร้างเส้นแบบ path จากนั้นปิดเส้นด้วยเมธอด closePath(). เราสามาร...

Read More

การวาดเส้นแบบ Path ใน Canvas (HTML5)

การวาดเส้นแบบ Path สำหรับการสร้างเส้นแบบ path ด้วย HTML5 Canvas เราจะใช้วิธีการเชื่อมเส้นหลายเส้นเข้าด้วยกันโดยที่จุดสิ้นสุดของแต่ละส้นจะกล...

Read More

การวาดเส้นโค้งใน Canvas (HTML5)

การวาดเส้นโค้ง(Arc) ในการวาดเส้นโค้งใน HTML5 Canvas นั้นเราจะใช้เมธอด arc(centerX, centerY, radius, startingAngle, endingAngle, antiClockwi...

Read More

การวาดเส้นตรงใน Canvas (HTML5)

เพื่อที่จะวาดเส้นตรงใน HTML5 Canvas เราสามารถใช้เมธอดเหล่านี้คือ beginPath(), moveTo(), lineTo(), และ stroke() . โดยในตอนที่จะเริ่มวาดเส้นต...

Read More

Canvas element ใน HTML5 คืออะไร

Canvas element ใน HTML5 คือ  แท็คตัวหนึ่งใน HTML คล้ายๆกับแท็คอื่นเช่น <br />, <div> , <a href=""/> ยกเว้นในเร...

Read More

การทำให้ตัวอักษรตัวแรกให้เป็นตัวใหญ่ใน javascript

การทำให้ตัวอักษรตัวแรกให้เป็นตัวใหญ่นั้นจะเกิดในกรณีของภาษาอังกฤษครับ ในกรณีของภาษาไทยนั้นไม่มี ซึ่งวิธีการก็มีหลายๆวิธี หลายแบบด้วยกันครับ ...

Read More

การ Import โปรเจคที่มีอยู่แล้วเข้ามาใน Eclipse

บ่อยครั้งที่เราเอาโคดตัวอย่างจากอินเตอร์เน็ตดาวน์โหลดมาศึกษา ซึ่งการที่จะดูโคดและผลลัพธ์ได้นั้นเราต้อง นำโปรเจคตัวอย่างหรือโปรเจคจริงๆที่เรา...

Read More