canvas绘制多边形、填充颜色
作者:Miao 阅读:3265次
效果:
<canvas id="canvas" width="600" height="450" style="border:1px solid #aaa;"></canvas>
<script type="text/javascript"> window.onload = function() { var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); // 位置(坐标点): context.moveTo(200, 100); context.lineTo(300, 50); context.lineTo(400, 100); context.lineTo(400, 200); context.lineTo(300, 250); context.lineTo(200, 200); context.lineTo(200, 100); // 回到一开始的位置,形成闭合 // 着色: context.fillStyle = "rgb(45,186,252)"; // 绘制区域填充色 context.strokeStyle = "#000"; // 绘制线条颜色 context.fill() context.stroke() } </script>
本站部分文章、数据、素材收集于网络,所有版权均归源网站或原作者所有!
如果侵犯了您的权益,请来信告知我们下线删除,邮箱:357234902@qq.com