首先來(lái)看下如下代碼：

let canvas = document.getElementById("canvas");canvas.width = 800;canvas.height = 800;let context = canvas.getContext("2d");context.lineWidth = 10;context.lineTo(10, 10);context.lineTo(80, 10);context.lineTo(80, 80);context.lineTo(10, 80);context.lineTo(10, 10);context.stroke();

程序運(yùn)行截圖如下：

把代碼改成如下：

let canvas = document.getElementById("canvas");canvas.width = 800;canvas.height = 800;let context = canvas.getContext("2d");context.lineWidth = 10;context.moveTo(10, 10);context.lineTo(80, 10);context.lineTo(80, 80);context.lineTo(10, 80);context.lineTo(10, 10);context.stroke();

運(yùn)行截圖如下：

總結(jié)下：

這里可以看到moveTo，是把筆尖moveTo到指定位置，然后使用lineTo去畫。

而lineTo是直接畫到指定的位置。當(dāng)沒(méi)有設(shè)置moveTo的時(shí)候，那么這個(gè)位置就為空，這樣話lineTo的第一個(gè)點(diǎn)就沒(méi)有東西，就是第一個(gè)圖。

?

?

?

總結(jié)

以上是生活随笔為你收集整理的canvas笔记-lineTo()与moveTo()的区别的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。