How to draw polygons on an HTML5 canvas?

CyanPrime picture CyanPrime · Jan 29, 2011 · Viewed 171.6k times · Source

I need to know how to draw polygons on a canvas. Without using jQuery or anything like that.

Answer

phihag picture phihag · Jan 30, 2011

Create a path with moveTo and lineTo (live demo):

var ctx = canvas.getContext('2d');
ctx.fillStyle = '#f00';
ctx.beginPath();
ctx.moveTo(0, 0);
ctx.lineTo(100,50);
ctx.lineTo(50, 100);
ctx.lineTo(0, 90);
ctx.closePath();
ctx.fill();