HTML canvas lineTo() 方法

Εγχειρίδιο HTML5 Canvas

定义和用法

lineTo() 方法添加一个新点，然后创建从该点到画布中最后指定点的线条（该方法并不会创建线条）。

提示：请使用 stroke() 方法在画布上绘制确切的路径。

实例

例子 1

开始一条路径，移动到位置 0,0。创建到达位置 300,150 的一条线：

Το πρόγραμμα περιήγησής σας δεν υποστηρίζει την ετικέτα HTML5 canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();

Δοκιμάστε το προσωπικά

提示：页面底部提供更多例子。

语法

context.lineTo(x,y);

参数值

参数 描述
x 路径的目标位置的 x 座标。
y 路径的目标位置的 y 座标。

更多例子

Παράδειγμα 2

Παράδειγμα 2

Το πρόγραμμα περιήγησής σας δεν υποστηρίζει την ετικέτα HTML5 canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.stroke();

Δοκιμάστε το προσωπικά

Υποστήριξη προγράμματος περιήγησης

Τα αριθμήματα στη τаблицή σημειώνουν την έκδοση του πρώτου προγράμματος περιήγησης που υποστηρίζει αυτήν την ιδιότητα.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Σημείωση:Το Internet Explorer 8 και οι προηγούμενες εκδόσεις δεν υποστηρίζουν το στοιχείο <canvas>.

Εγχειρίδιο HTML5 Canvas