掌握canvas技巧：成为canvas专家，轻松驾驭

精通 Canvas 方法：成为 Canvas 方法的专家，驾驭自如，需要具体代码示例

导言：
Canvas 是 HTML5 提供的用于在页面上绘制图像的功能强大的元素。通过 Canvas，我们可以使用 JavaScript 来绘制图形、创建动画以及进行图像处理等操作。掌握 Canvas 方法将使我们能够充分发挥创造力，实现丰富多样的视觉效果。本文将介绍一些常用的 Canvas 方法，并提供相应的代码示例，帮助读者成为 Canvas 方法的专家。

一、绘制基本形状

1. 绘制矩形（rect）
   使用 rect() 方法可以绘制矩形，并可设置填充颜色和边框颜色。
   代码示例：

   const canvas = document.getElementById(\'myCanvas\');
   const ctx = canvas.getContext(\'2d\');
   
   ctx.fillStyle = \'red\';     // 设置填充颜色为红色
   ctx.fillRect(10, 10, 100, 100);    // 绘制填充矩形
   
   ctx.strokeStyle = \'blue\';   // 设置边框颜色为蓝色
   ctx.lineWidth = 2;    // 设置边框线宽为 2 像素
   ctx.strokeRect(50, 50, 100, 100);   // 绘制边框矩形