FabricJS を使用して画像と色のパターンをポリゴンに追加する

fabric.Polygon のインスタンスを作成することで、ポリゴン オブジェクトを作成できます。多角形オブジェクトは、接続された直線セグメントのセットで構成される任意の閉じた形状で記述することができます。これは FabricJS の基本要素の 1 つであるため、角度や不透明度などのプロパティを適用することで簡単にカスタマイズすることもできます。ポリゴンにパターンと色を追加するには、FabricJS の Pattern クラスを使用します。

文法

new fabric.Pattern( options: Object, callback: function )

パラメータ

• options (オプション) - このパラメータは、オブジェクトに追加のカスタマイズを提供する Object です。パラメータ offsetX、cross-origin、およびその他の多くのプロパティは、パターンに関連して変更できます。

• callback - このパラメータは、コールバックが初期化された後に呼び出される function です。このパラメータはオプションです。

例 1: Fabric.Pattern() のインスタンスを作成し、それをポリゴン オブジェクトに追加します。

fabric.Pattern

createPattern 関数を初期化します。最後に、createPattern 関数を呼び出し、目的の URL を渡します。 リーリー 例 2: 画像と色のパターンをポリゴンに追加する

fromURL

fabric.StaticCanvas() オブジェクトを初期化しました。これは、FabricJS の主要なレンダリング サーフェイスの 1 つであり、動的なパターンが重要です。 setBackgroundColor

リーリー ＃＃＃結論は＃＃＃ このチュートリアルでは、2 つの簡単な例を使用して、FabricJS を使用して画像と色のパターンをポリゴンに追加する方法を示します。

以上がFabricJS を使用して画像と色のパターンをポリゴンに追加するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。