路径描边设置样式

// 想要在Cavnas上面画图，就需要用JavaScript // 2. 取得绘图工具：我们可以从canvas标签上获取一个绘图对象（上下文对象）， // 绘图的各种方法和设置，都放在这个对象上. var cvs = document.getElementById('cvs'); var ctx = cvs.getContext('2d'); // 获取canvas2d绘图工具 // 3. 绘制路径。 ctx.moveTo(50,50); // 把“钢笔”移动到图像的某个位置上 ctx.lineTo(150,50); // 用“钢笔”连线到某个点上 ctx.lineTo(150,150); ctx.lineTo(50,150); ctx.lineTo(50,50); // 现在我们的canvas上还什么都没有呢，为什么？ 因为moveTo和lineTo是用来绘制路径的。 // 路径是用来描述我们想要绘制的形状或者线条的“草稿” // 4. 填充或者描边路径。 // 在描边或者填充之前，我们可以设置描边或者填充的颜色。 // Canvas是“画过之后浏览器就不管他了”的机制， // 所以我们想要设置描边或者填充的样式，必须在描边或者填充之前 // 如果我们已经描边或者填充了，再去设置样式，是不管用的

ctx.strokeStyle = 'lightgreen'; // 设置描边的颜色为绿 ctx.lineWidth = 25; // 设置描边的线条宽度 ctx.stroke(); // 描边

ctx.fillStyle = 'pink'; ctx.fill(); // 填充