ホームページ >ウェブフロントエンド >jsチュートリアル >FabricJSを使用して三角形を非表示にする方法は?

FabricJSを使用して三角形を非表示にする方法は?

WBOY
WBOY転載
2023-09-17 23:41:10757ブラウズ

如何使用 FabricJS 使三角形不可见?

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

三角形オブジェクトは、寸法の変更、背景色の追加、表示/非表示など、さまざまな方法でカスタマイズできます。これを行うには、visible 属性を使用します。

構文

 new Fabric.Triangle( {visible: Boolean }: Object)

パラメータ

  • オプション (オプション) - このパラメータは Object は、三角形に追加のカスタマイズを提供します。このパラメータを使用すると、色、カーソル、ストローク幅、その他多くのプロパティなど、visible プロパティに関連するオブジェクトのプロパティを変更できます。

  • オプション キー

    • visible - このプロパティは boolean 値を受け入れ、次のことを可能にします。オブジェクトがキャンバス上にレンダリングされます。デフォルト値は true です。

    #例 1

    visible 属性を「true」値を持つキーとして渡します

    visible プロパティに true 値を渡すと何が起こるかを理解するために、コード例を見てみましょう。値「true」を指定すると、三角形オブジェクトがキャンバスにレンダリングされます。これは FabricJS のデフォルトの動作でもあります。

    
    
    
    
    
    
    将可见属性作为具有“true”值的键传递
    您可以看到三角形对象已渲染到画布上
    
    
    // 启动画布实例
    var canvas = new Fabric.Canvas("canvas");
    canvas.setWidth(document.body.scrollWidth);
    画布.setHeight(250);
    
    // 初始化一个三角形对象
    var triangle = new Fabric.Triangle({
    左:60,
    顶部:80,
    填写:“#b0e0e6”,
    身高:90,
    宽度:100,
    });
    
    // 将其添加到画布中
    canvas.add(三角形);
    
    
    

    例 2

    visible 属性を値「false」のキーとして渡す

    この例では, visible 属性を false 値のキーとして渡します。 false の値を割り当てると、三角形オブジェクトがキャンバスにレンダリングされなくなります。オブジェクトを「非表示」にするだけではなく、完全に削除します。これを使用すると、コードを削除せずにキャンバスからオブジェクトを削除できます。 えええええ

以上がFabricJSを使用して三角形を非表示にする方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はtutorialspoint.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。