溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
在 TypeScript 中使用 Canvas API 的步驟如下：
<canvas id="myCanvas" width="500" height="500"></canvas>
const canvas = document.getElementById("myCanvas") as HTMLCanvasElement;
const ctx = canvas.getContext("2d");
ctx.fillStyle = "red";
ctx.fillRect(50, 50, 100, 100);
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.beginPath();
ctx.moveTo(100, 100);
ctx.lineTo(200, 200);
ctx.lineTo(100, 200);
ctx.closePath();
ctx.stroke();
canvas.addEventListener("click", (event) => {
const x = event.clientX - canvas.getBoundingClientRect().left;
const y = event.clientY - canvas.getBoundingClientRect().top;
// 在點擊位置繪制一個圓
ctx.beginPath();
ctx.arc(x, y, 10, 0, 2 * Math.PI);
ctx.fill();
});
通過以上步驟，你就可以在 TypeScript 中使用 Canvas API 來繪制圖形和實現交互了。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
