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

เพื่อที่จะสร้างรูปทรงหลายเหลี่ยมด้วย KineticJS นั้น  เราจะใช้ Kinetic.Polygon() ครับ. สำหรับรายละเอียดวิธีการใช้แอตทริบิวต์และเมธอดสามารถดูได้จากที่นี่ครับ API Document : http://kineticjs.com/docs/Kinetic.RegularPolygon.html

ตัวอย่าง แทคที่ใช้
ตัวอย่าง : วาดรูปทรงหลายเหลี่ยม
      var stage = new Kinetic.Stage({
        container: 'container',
        width: 578,
        height: 200
      });

      var layer = new Kinetic.Layer();
      // ลักษณะการกำหนดเส้นจำใส่ตัวเลขเป็นคู่ๆ point[x,y,x,y,.....] อ้างอิงตำแหน่งบน canvas
      var poly = new Kinetic.Polygon({
        points: [73, 192, 73, 160, 340, 23, 500, 109, 499, 139, 342, 93],
        fill: 'blue',    // ใส่สีพื้น
        stroke: 'black', // กำหนดสีเส้น
        strokeWidth: 5   // กำหนดขนาดเส้น
      });

      // add the shape to the layer
      layer.add(poly);

      // add the layer to the stage
      stage.add(layer);

ผลลัพธ์ที่ได้คือ

About Nop

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.
    Blogger Comment

0 comments:

Post a Comment