这一期我们要学的是fillRect()方法在画布上绘制的矩形会填充指定的颜色。填充的颜色通过fillStyle 属性指定。<canvas width="300" height="300" id="canvas"/> <script> // 0. 获取到页面上的 canvas 标签元素节点 const canvasEle = document.querySelector('#canvas') // 1. 获取当前这个画布的工具箱 const ctx = canvasEle.getContext('2d') //绘制红色矩形 ctx.fillStyle = "#ff0000"; ctx.fillRect(10, 10, 50, 50); //绘制半透明的蓝色矩形 ctx.fillStyle = "rgba(0,0,255,0.5)"; ctx.fillRect(30, 30, 50, 50); </script>
学习如何通过使用 stroke() 或 fill() 方法在画布上实际地绘制矩形。绘制成功后图片如下。 <canvas width="300" height="300" id="canvas"/> <script> // 0. 获取到页面上的 canvas 标签元素节点 const canvasEle = document.querySelector('#canvas') // 1. 获取当前这个画布的工具箱 const ctx = canvasEle.getContext('2d') // 红色矩形 ctx.beginPath(); ctx.lineWidth="6"; ctx.strokeStyle="red"; ctx.rect(5,5,290,140); ctx.stroke(); // 绿色矩形 ctx.beginPath(); ctx.lineWidth="4"; ctx.strokeStyle="green
刚分享了二阶的贝塞尔曲线，那么三阶贝塞尔曲线可以怎么绘制呢（代码非原创）？
下面我们继续看看二阶贝塞尔曲线是如何绘制的（代码非原创哦）。
如何用cvans绘画，绘制一座房屋？快来看看下面的代码（代码非原创）。
龙鹰
IP地址位置数据由纯真CZ88提供支持
