如何使用 HTML5 Canvas 繪製線條?
HTML5<canvas>標籤用於繪製圖形、動畫等。它是 HTML5 中引入的一個新標籤。使用 lineTo() 方法透過 HTML5 畫布繪製線條。
你可以嘗試執行以下程式碼,瞭解如何使用 HTML5 Canvas 繪製線條
示例
<!DOCTYPE html> <html> <head> <title>HTML5 Canvas Tag</title> </head> <body> <canvas id="newCanvas" width="400" height="300" style="border:1px solid #000000;"></canvas> <script> var c = document.getElementById('newCanvas'); var ctx = c.getContext('2d'); // Drawing lines ctx.beginPath(); ctx.moveTo(30, 30); ctx.lineTo(180, 100); ctx.moveTo(30, 10); ctx.lineTo(260, 100); ctx.stroke(); </script> </body> </html>
輸出
廣告