canvas笔记-closePath函数的使用（含例子）
生活随笔
收集整理的這篇文章主要介紹了
canvas笔记-closePath函数的使用（含例子）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
如下代碼：
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body> <canvas id="canvas" style="border:1px solid #aaa;display:block;margin:50px auto;">當前瀏覽器不支持Canvas，請更換瀏覽器后再試 </canvas><script>window.onload = function(){let canvas = document.getElementById("canvas");canvas.width = 800;canvas.height = 800;let context = canvas.getContext("2d");context.lineWidth = 10;context.beginPath();context.moveTo(100, 200);context.lineTo(300, 400);context.lineTo(100, 600);context.strokeStyle = "red";context.closePath();context.stroke();} </script></body> </html>運行截圖如下：
修改代碼如下：
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head> <body> <canvas id="canvas" style="border:1px solid #aaa;display:block;margin:50px auto;">當前瀏覽器不支持Canvas，請更換瀏覽器后再試 </canvas><script>window.onload = function(){let canvas = document.getElementById("canvas");canvas.width = 800;canvas.height = 800;let context = canvas.getContext("2d");context.lineWidth = 10;context.beginPath();context.moveTo(100, 200);context.lineTo(300, 400);context.lineTo(100, 600);context.fillStyle = "red";context.closePath();context.fill();} </script></body> </html>運行截圖如下：
如上例子，closePath會讓多邊形封口。
?
?
總結
以上是生活随笔為你收集整理的canvas笔记-closePath函数的使用（含例子）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Qt文档阅读笔记-Qt对象模型及dele
- 下一篇： Arduino笔记-9110风扇模块的使