HTMLキャンバスのlineTo()メソッド
例
位置0,0に、パスを開始します。 300、150はラインを作成するための位置に到達しました。
JavaScriptを:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();
»をお試しください
ブラウザのサポート
Internet Explorer 9の、Firefoxの、オペラ、ChromeとSafariのサポートのlineTo()メソッド。
注:のInternet Explorer 8およびそれ以前のバージョンでは、<キャンバス>要素をサポートしていません。
定義と使用法
lineTo()メソッドは、新しいポイントを追加し、(このメソッドは行を作成しません)最後に指定されたポイントでキャンバスにそのポイントからラインを作成します。
ヒント:使用ストローク()キャンバス上の正確なパスを描画する方法を。
JavaScriptシンタックス: | コンテキスト.lineTo(X、Y) |
---|
パラメータ値
参数 | 描述 |
---|---|
x | 路径的目标位置的 x 坐标。 |
y | 路径的目标位置的 y 坐标。 |
より多くの例
例
パスの形状を描画する文字Lであります:
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();
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.stroke();
»をお試しください
HTMLキャンバスリファレンスマニュアル