HTML canvas fillRect() Method

Paglilinaw at Paggamit

fillRect() Mga paraan sa pagpipintas ng isang retanggulo na may kulay na ipinupunan. Ang default na kulay ng pagpintas ay itim.

Mga payo:Ginagamit: fillStyle Ang mga katangian ay ginagamit upang itakda ang kulay, gradient o pattern na gagamitin sa pagpipintas.

Sample

Ihanda ang 150*100 na pixel na napupunan na retanggulo:

Ang iyong browser ay hindi sumusuporta sa tag ng HTML5 canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillRect(20,20,150,100);

親自試試

語法

context.fillRect(x,y,width,height);

參數值

參數 描述
x 矩形左上角的 x 坐標。
y 矩形左上角的 y 坐標。
width 矩形的寬度,以像素計。
height 矩形的高度,以像素計。

瀏覽器支持

表中的數字注明了首個完全支持該屬性的瀏覽器版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

註釋:Internet Explorer 8 並且更早的版本不支持 <canvas> 元素。