How to use html5 canvas to draw solid prototypes

This article mainly introduces how to use html5 canvas to draw solid prototypes, the article is very detailed, has a certain reference value, interested friends must read it!

Use html5 canvas to draw solid prototypes. # canvas {width: 500px; height: 500px;} var canvas=document.getElementById ("canvas"); var ctx=canvas.getContext ("2d"); / / draw a hollow circle ctx.beginPath (); / / arc () method is to create an arc / curve (used to create a circle or part of a circle) / / context.arc / / the starting angle is 0 / / the end angle is 2*Math.PI ctx.arc; ctx.lineWidth=5; ctx.strokeStyle= "green"; / use the stroke () or fill () method to draw the actual arc ctx.stroke () on the canvas; / / draw a hollow circle ctx.closePath (); / / draw a solid circle / / ctx.beginPath (); / / ctx.arc (200,100,50,060,360); / / ctx.fillStyle= "red" / / fill color, default is black / / ctx.fill (); / / draw solid circle / / ctx.closePath (); / / combination of hollow and solid / / ctx.beginPath (); / / ctx.arc (100, 100, 50, 50 and 360); / / ctx.fillStyle= "red"; / / ctx.fill (); / / ctx.strokeStyle= "green"; / / ctx.stroke (); / / ctx.closePath () The above is all the content of the article "how to draw a solid prototype with html5 canvas". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!