rect in canvas by js
<h1>how to draw a rect in canvas by js</h1>
<canvas id="my" width="200" height="100" style=" border:1px solid #f00;">
</canvas>
<script>
var c = document.getElementById("my");
var ctx = c.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(2,5,150,75);
</script>
Note:- here 2 is distance on x axis, 5 is distance on y axis.
here 150 is width of rect and 75 is height.
fillstyle: in rectangel fillstyle property use to fil the background color of in rectangle.
demo is here https://jsfiddle.net/j9va5j34/
<canvas id="my" width="200" height="100" style=" border:1px solid #f00;">
</canvas>
<script>
var c = document.getElementById("my");
var ctx = c.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(2,5,150,75);
</script>
Note:- here 2 is distance on x axis, 5 is distance on y axis.
here 150 is width of rect and 75 is height.
fillstyle: in rectangel fillstyle property use to fil the background color of in rectangle.
demo is here https://jsfiddle.net/j9va5j34/
Comments
Post a Comment