Canvas beginPath() 方法
示例
在畫布上繪製一條紫色路徑和一條綠色路徑
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.strokeStyle = "green";
ctx.lineWidth = 5
// 開始繪製路徑
ctx.beginPath();
ctx.moveTo(0, 75);
ctx.lineTo(250, 75);
// 繪製路徑
ctx.stroke();
// 開始一個新的路徑
ctx.beginPath();
ctx.strokeStyle = "purple";
ctx.moveTo(50, 0);
ctx.lineTo(150, 130);
// 繪製路徑
ctx.stroke();
自己動手試一試 »
描述
beginPath()
方法開始一個新路徑或重置當前路徑。
另請參閱
closePath() 方法 (關閉當前路徑)
moveTo() 方法 (將路徑移動到指定點)
lineTo() 方法 (向路徑新增一條線)
fill() 方法 (填充當前路徑)
stroke() 方法 (繪製當前路徑)
語法
context.beginPath() |
引數
無 |
返回值
無 |
瀏覽器支援
<canvas>
元素是 HTML5 標準(2014)。
beginPath()
在所有現代瀏覽器中都受支援。
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 9-11 |
❮ Canvas 參考