問題タブ [fabricjs]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
3 に答える
5292 参照

javascript - Fabric.js + Google フォント

Cufon ライブラリとそのフォントをアタッチせずに、Web フォントでFabric.jsを使用することは可能ですか? キャンバスの標準機能で簡単にできるので、Fabricでもできるかな。

0 投票する
4 に答える
3868 参照

javascript - SVGパス要素のd属性を解析します

SVG Path要素のd属性を解析しようとしていますが、これまでのところ、fabric.jsがSVGを解析できることがわかりましたが、今のところ、その方法がわかりません。

パス内の形状(線の円弧)を取得してその上に正方形を描画するためにパスを解析する必要があります。最も重要なのは、これらの正方形の属性を返すことです。

これをfabric.jsを使用して行う方法はありますか?または他のライブラリ?? または誰かが別のアプローチを持っていますか?

次の画像には長方形があり、線には両方とも境界に描いた正方形があり、パス要素でも同じことをしようとしています。長方形と境界線

0 投票する
6 に答える
34043 参照

javascript - Fabric.js-長方形を自由に描く

正しく機能しない次のものがあります。

上記のロジックは、fabric.jsなしで使用した単純な長方形の描画システムからのものであるため、fabric.jsでは機能しないことがわかっています。

長方形を描画するとカーソルに正しく従わないため、計算がオフになっているか、幅/高さ/ x/yの値で誤ったパラメータを設定しているようです。

どんな助けでも大歓迎です、事前に感謝します:)

0 投票する
1 に答える
1945 参照

scroll - FabricJS Canvas、スクロールする親コンテナーが子のヒット領域を移動する

FabricJS を使用してアプリケーションを作成しています。親div/コンテナをスクロールすると、スクロール量に直接関係して、オブジェクトの選択可能領域が右にオフセットされることがわかりました。

したがって、1200x600 のキャンバスと 600x600 のコンテナー div があり、そのキャンバスに 400, 120; の四角形を追加するとします。200px スクロールすると、四角形をクリックして選択できません。むしろ、マウスを 600、120 (空のスペース) に移動して、クロス バーを取得し、四角形を選択する必要があります。

これが知られているかどうか、または回避策があるかどうかはわかりませんが、可能な限り助けていただければ幸いです。

0 投票する
2 に答える
3627 参照

javascript - HTML5 キャンバスの fabric.js ライブラリのフォントの太さ

私は canvas と素晴らしいファブリック ライブラリで遊んでいます。通常のウェイト以外で表示するテキストを取得できません。すなわち

太字」タグは適用されません。cufonfont.jsを訴えるファイルを作成したとき、太字と斜体のフォントを含めました。どんなアイデアもありがたく受け取った。

0 投票する
1 に答える
4154 参照

javascript - Fabric.jsでキャンバスをHTMLにエクスポートするには?

複数のオブジェクトを持つキャンバス要素を、fabricjs を使用して JavaScript コードで html にエクスポートする方法はありますか? toJSON または toObject をエクスポートできることはわかっていますが、これは HTML ではありません。

http://canvimation.github.com/には、キャンバスの描画をネイティブの html コードにエクスポートする機能 (file>export canvas to html) があることがわかりました。fabricjs で可能ですか?

0 投票する
5 に答える
10116 参照

php - Ajax によって PHP に送信される Fabric.js canvas.toDataURL()

背景が透明な画像を作成する必要がある場合、ここで問題が発生します。問題が fabricjs にあるのか php にあるのかはまだわかりません。色付きの背景を持つ画像を送信すると、すべて正常に動作します。背景が透明な画像を送信すると問題が発生します。生成された画像は、黒の背景で作成されます。ユーザーが保存ボタンをクリックすると、キャンバスの文字列表現がサーバー側のphpに送信され、キャンバスの画像が生成されます。したがって、次の関数を使用して、キャンバスの文字列表現を Ajax (jQuery の POST 関数) で送信しています。

PHP ファイルでは、次のコードを使用して画像を生成しています。

繰り返しますが、問題は背景が透明なキャンバスだけです。色付きの背景を使用すると、すべて正常に機能します。

0 投票する
1 に答える
450 参照

javascript - Fabric.jsに関連付けられたキャンバスの外でCufonを使用する

Fabric.jsに関連付けられているキャンバスの外でCufonlibを使用しようとすると、ここで問題が発生します。アプリケーションで、使用可能なフォントを表示するテキストフォントセレクターを作成しようとしています。セレクターは、フォントのサンプルとしてフォント名を表示します(Photoshopなど)。したがって、サンプル名を作成するために、Cufonを使用してフォントスタイルを置き換えようとしていますが、Fabric.jsではキャンバスの外部での使用は許可されていません。Fabric.jsは、Cufonがキャンバス内で置き換えるテキストを表示します。誰かがこれをどのように解決するか知っていますか?ありがとう。

0 投票する
6 に答える
29909 参照

html - Fabric.js を使用したインタラクティブなテキスト フィールド

ここ数週間、Fabric.js をいろいろいじってきましたが、テキスト フィールドに関しては、作成時にテキストを設定できることしかわかりませんでした。

インタラクティブなテキスト フィールドを作成する方法はありますか?それを実現するための回避策を見つける必要がありますか? (インタラクティブなテキスト フィールドとは、クリックして直接書き込むことができるキャンバスの領域を意味します。)

0 投票する
3 に答える
7835 参照

javascript - Fabric.js: オーバーレイ イメージの背後にあるイメージ コントロール

jquery と fabric.js ライブラリを使用してキャンバス ユーザー インターフェイスを構築しています。次のコードを使用して、透明なセクションでオーバーレイ png 画像を設定します。

また、オーバーレイの背後に画像を追加し、次のコードを使用してコンテナに合わせてサイズを変更しました

期待どおりに機能しますが、画像をクリックして拡大縮小/サイズ変更すると、オーバーレイ画像の透明なスペースを除いて、コントロールが表示されません。コントロールはオーバーレイ画像の後ろにあります。画像全体をオーバーレイの前に配置することなく、画像コントロールを強制的に表示する方法はありますか?