Menu
I need to know how to draw polygons on a canvas. Without using jQuery or anything like that.
775
To draw a polygon in HTML SVG, use the SVG <polygon> element. The <polygon> element creates a graphic containing at least three sides.
We can create many shapes like rectangle, circle, squares, cone, and other custom shapes. HTML5 provides us many elements to create different shapes like Canvas curves and Canvas paths. In this article, we are trying to create some basic shapes of the HTML5 Canvas.
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(); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
