このライブラリの使用方法bezierjs？

私はカーブを持つキャンバスドローを持っています。私はこのライブラリの例の1つのように、そのサイズを知りたいと思います。このライブラリの使用方法bezierjs？

私は私のキャンバスのドローであなたの例を組み合わせることができますどのように？

これは私のjavascriptのコードです：

<script type="text/javascript"> 
var canvas=document.getElementById("canvas"); 
var ctx=canvas.getContext("2d"); 

c_size = 650; 

ctx.canvas.width = c_size; 
ctx.canvas.height = c_size; 

ctx.beginPath(); 
ctx.strokeStyle = 'blue'; 
ctx.moveTo(535,105); 
ctx.quadraticCurveTo(585,44,620,115); 
ctx.quadraticCurveTo(628,155,643,155); 
ctx.quadraticCurveTo(628,195,643,360); 
ctx.lineTo(550,368); 
ctx.lineTo(538,302); 
ctx.lineTo(552,285); 
ctx.quadraticCurveTo(528,195,535,105); 
ctx.stroke(); 
</script> 
<canvas id='canvas' width='650' height='650' style="border: 1px solid #000"> 
Canvas not supported 
</canvas>

出典

2017-08-24 Developer933

ポーマックスが表示されていないかどうかを確認できます。： - ] – K3N

カーブ情報を取得するためにBezier.jsを使用しようとするコードに何も表示されません。今はキャンバスを使っているだけです。キャンバス+ SVGには実際にたくさんの描画と測定操作があります。しかし、これはまた、 "あなたはベジエールが必要なのですか？あなたは何をしようとしていますか？" –

私はthe actual page for this libraryにあなたのAPIを経由与えるかなり確信しています。他のブラウザライブラリと同様に、ページ上にインクルードしてください（明示的な指示は必要ありません）。次に、指示に従ってライブラリを呼び出します。インスタンスを作成し、オンラインドキュメントに記述されているAPI関数を呼び出します。

また、HTML5では、が JavaScriptでない限り、スクリプトの種類を指定しないことに注意してください。だから、：

<!doctype html> <html> ... <script src="bezier.js"></script> ... <canvas id="mycanvas"></canvas> ... <script src="yourscript.js">?</script> ... </html>

そしてあなた自身のファイルに：

const cvs = document.getElementById("mycanvas"); const size = 650; cvs.width = size; cvs.height = size; let ctx = cvs.getContext("2d"); // now do things. Like this: const curve = new Bezier(/* some coordinates here */); const p = curve.points, p1 = p[0], p2 = p[1], p3 = p[2], p4 = p[3]; // draw the curve ctx.beginPath(); ctx.moveTo(p1.x,p1.y); ctx.curveTo(p2.x,p2.y, p3.x,p3.y, p4.x,p4.y); ctx.stroke(); // what do we know about the curve? let len = curve.length(); let bbox = JSON.stringify(curve.bbox()); let msg = `The curve has length ${len} and bounds ${bbox}`; document.getElementById('infopanel').textContent = msg;

注Bezier.jsは、描画ライブラリ自体ないであること、それはベジェ曲線で作業するための数学ライブラリです。 Canvasには2次曲線と3次曲線が組み込まれています（SVGパス命令セットと同様）。 Bezierjsは、弧の長さ、オンカーブポイントのLUT、交差計算などの「あなたのカーブに関する情報を得る」ためのサポートライブラリです。

出典

2017-08-26 17:29:16

このライブラリの使用方法bezierjs？

答えて

関連する問題