問題タブ [html5-canvas]

arrowToで関数を作成したいCanvasRenderingContext2D.prototype。そのためには、最後のポイントの座標を取得する必要があります。たとえば、

どうすればそれらを取得できますか？

コンテキストが使用されているキャンバスを取得する方法はありますか?

CanvasRenderingContext2Dキャンバス要素の幅/高さが必要なプロトタイプ関数を作成しているためです。

例えば：

HTML5を学習しています。学習したい例の1つは、キャンバス上に2つのポイントを作成することです。これは、2つのポイント間の線をトレースして結合できるはずです。これは、マウスとタッチイベントの両方を使用して実行する必要があります。モバイルデバイス。

これらのAPIを提供するフレームワークはありますか、それとも私が始めるために見ることができる例はありますか？

createRadialGradient()HTML5キャンバスで遊んでいます。（半）透明性を実装しようとしている場合を除いて、それは魅力のように機能します。

うまくいけば明確にするために、このjsFiddleを作成しました：http：//jsfiddle.net/rfLf6/1/。

何が起こっているのかというと、円（放射状のグラデーション）が(x, y)半径でペイントされ、rカラーストップはとです。ただし、緑の円は緑から黒になりますが、透明になる必要があります。つまり、背景の円の適切な赤い色になります。r'transparent'

HTML5キャンバスに透明な放射状グラデーションを実装するにはどうすればよいですか？

画像の一部で満たされたキャンバスに円を描こうとしています。白いキャンバスをクリックすると、ユーザーがクリックした場所に写真の一部が表示されると想像してください。

1 つの円を描く方法を見つけましたが、これを使用して複数の円を描くことはできません。他の座標でアクションを繰り返すと、描画が行われません。

これを達成する方法について何か考えはありますか? ありがとうございました。

後で編集（使用された正確なコード全体）

HTML5 キャンバスを使用して webkit ブラウザーで黒の影を描画するにはどうすればよいですか?

その場で要素を作成し、それらを移動できるようにするための最良のアプローチは何ですか? たとえば、長方形、円、多角形を作成し、それらのオブジェクトを選択して移動したいとします。

HTML5 には、これを可能にする 3 つの要素 ( svg、canvas、およびdiv ) が用意されていることを理解しています。私がやりたいことに対して、それらの要素のどれが最高のパフォーマンスを提供しますか?

これらのアプローチを比較するために、ヘッダー、フッター、ウィジェット、およびテキスト コンテンツをそれぞれに持つ 3 つの視覚的に同一の Web ページを作成することを考えていました。最初のページのウィジェットは完全にcanvasエレメントで作成され、2 番目のページは完全にエレメントで作成されsvg、3 番目のページはプレーンdivエレメント、HTML および CSS で作成されます。

キャンバスで二次曲線を描こうとしています。コードは次のとおりです。
HTML:

JavaScript:

しかし、結果は本当に醜いです。まず、線が太すぎます。次に、エイリアスが非常に明白です....どうすれば改善できますか?
ここで効果を確認できます: http://jsfiddle.net/7wNmx/1/

sine curveキャンバスで描画するプログラムを書いています。
HTML:

JavaScript:

これは本当にうまく機能します: http://jsfiddle.net/HhGnb/

ただし、キャンバスの幅は 100px しか指定できないため、曲線の左端の 100px しか表示されません。http://jsfiddle.net/veEyM/1/
この効果をアーカイブしたい: 曲線の右点がキャンバスの幅よりも大きい場合、曲線全体が左に移動する可能性があるため、曲線、それは曲線が左に流れているようなものです。それをしてもいいですか？

文字や単語が常に直立した状態で、テキストやグラフィックスを循環パスに沿って移動させる JavaScript スニペットが多数あります。

例: http://www.dseffects.com/f_scripts.html

月が地球を周回するように、1 つの面を常に中心に向けて、テキスト (またはグラフィック) を点の周回させたいと考えています。次の例はこれを示していますが、非常に大雑把で、Web フォントを使用していません。

例: http://javaboutique.internet.com/text/Manipulation/TextRotor/

最初の例のように (カーソルの周りだけでなく) オービット コードを変更して、各文字/画像が一方の側を中心 (軸) に保つようにする方法があると確信しています。