FabricJSを使用して三角形の幅を設定するにはどうすればよいですか?

WBOY
リリース: 2023-08-25 13:05:10
転載
618 人が閲覧しました

如何使用 FabricJS 设置三角形的宽度?

このチュートリアルでは、FabricJS を使用して三角形の幅を設定する方法を学びます。三角形は、FabricJS によって提供されるさまざまな形状の 1 つです。三角形を作成するには、Fabric.Triangle クラスのインスタンスを作成し、それをキャンバスに追加する必要があります。

三角形オブジェクトの位置、不透明度、ストローク、寸法を変更することで、三角形オブジェクトを操作できます。 FabricJS では、width プロパティ height プロパティ

を使用してオブジェクトのサイズを制御できます。

構文

new Fabric.Triangle({ width: Number }: Object)
ログイン後にコピー

パラメータ
  • < p>オプション (オプション) このパラメータは オブジェクトです。三角形に追加のカスタマイズを提供します。このパラメータを使用すると、色、カーソル、ストローク幅などのプロパティや、width

    が属性であるオブジェクトに関連するその他の多くのプロパティを変更できます。
  • < /ul>

    オプション キー
    • Width - このプロパティは、numeric

      値を受け入れます。オブジェクトの幅を指定します。デフォルト値は 100 です。

    例 1

    width プロパティのデフォルトの動作< /p>

    コード例を見てみましょうwidth 属性のデフォルトの動作。

    
    
    
    
    
    
    宽度属性的默认行为
    可以看到三角形的宽度默认为100
    
    
    // 启动画布实例
    var canvas = new Fabric.Canvas("canvas");
    canvas.setWidth(document.body.scrollWidth);
    画布.setHeight(250);
    
    // 初始化一个三角形对象
    var triangle = new Fabric.Triangle({
    左:60,
    顶部:50,
    填写:“#b0e0e6”,
    身高:90,
    });
    
    // 将其添加到画布中
    canvas.add(三角形);
    
    
    
    ログイン後にコピー

    例 2

    width 属性をキーとして渡す

    これで、width

    が得られました。この属性には 180px の値が割り当てられており、その幅の変化がわかります。 えええええ###

    以上がFabricJSを使用して三角形の幅を設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:tutorialspoint.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!