canvas绘制矩形

标签：const   pre   直接   doc   txt   rect   clear   canvas   ntb   

canvas绘制矩形

1. 方法

   fillRect(x, y, width, height)           画一个实心的矩形
   clearRect(x, y, width, height)          清除一块儿矩形区域
   strokeRect(x, y, width, height)         画一个带边框的矩形
   rect(x, y, width, height)               直接画一个矩形

2. 画一个矩形

   const canvas = document.getElementById(‘canvas‘);
   const ctx = canvas.getContext(‘2d‘);
   
   ctx.fillRect(25, 25, 100, 100);
   ctx.clearRect(45, 45, 60, 60);
   ctx.strokeRect(50, 50, 50, 50);

3. 画一个矩形（使用rect）

   ctx.rect(50,50,200,100);    
   ctx.fill();

canvas绘制矩形

标签：const   pre   直接   doc   txt   rect   clear   canvas   ntb   

原文地址：https://www.cnblogs.com/ye-hcj/p/10356718.html