最新のWeb開発のチュートリアル
 

HTML canvas lineTo() Method

<Canvasオブジェクト

パスを開始し、位置0,0に移動します。 300150を配置する行を作成します。

YourbrowserdoesnotsupporttheHTML5canvastag。

JavaScriptを:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();
»それを自分で試してみてください

ブラウザのサポート

表中の数字は完全に方法をサポートする最初のブラウザのバージョンを指定します。

方法
lineTo() 4.0 9.0 3.6 4.0 10.1

定義と使用法

lineTo()メソッドは、新しいポイントを追加し、キャンバスの最後の指定されたポイントへのポイントからラインを作成します(this method does not draw the line)

Tip:使用stroke()実際にキャンバス上のパスを描画する方法を。

JavaScriptシンタックス: contextlineTo( x,y )

パラメータ値

パラメーター 説明 それを再生します
x に行を作成する場所のx座標 それを再生します»
y に行を作成する場所のY座標 それを再生します»

例

その他の例

文字Lのような形状のパスを、描きます。

YourbrowserdoesnotsupporttheHTMLcanvastag。

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();
»それを自分で試してみてください


<Canvasオブジェクト