Heim  >  Artikel  >  Web-Frontend  >  Wie mache ich die Kontrollecken eines Dreiecks mit FabricJS transparent?

Wie mache ich die Kontrollecken eines Dreiecks mit FabricJS transparent?

WBOY
WBOYnach vorne
2023-09-17 23:13:061526Durchsuche

如何使用 FabricJS 使三角形的控制角透明?

In diesem Tutorial lernen wir, wie man mit FabricJS die Kontrollecken eines Dreiecks transparent macht. Dreieck ist eine der verschiedenen Formen, die FabricJS bereitstellt. Um ein Dreieck zu erstellen, müssen wir eine Instanz der Fabric.Triangle-Klasse erstellen und sie der Leinwand hinzufügen. Mit der Eigenschaft transparentCorners können wir die Kontrollecken des Dreiecks transparent machen.

Syntax

new Fabric.Triangle( {透明Corners: Boolean }: Object)

Parameter

  • Optionen (optional) – Dieser Parameter ist ein Objekt, das unserem Dreieck zusätzliche Anpassungen ermöglicht. Mit diesem Parameter können Sie Eigenschaften ändern, die sich auf das Objekt beziehen, dessen transparentCorners ein Attribut ist, wie z. B. Farbe, Cursor, Strichstärke und viele andere Eigenschaften.

  • Optionsschlüssel

    • transparentCorners – Diese Eigenschaft akzeptiert einen booleschen-Wert, der es uns ermöglicht, die Kontrollecken des Objekts transparent oder undurchsichtig darzustellen. Der Standardwert ist true.

    Beispiel 1

    Übergabe der Eigenschaft transparentCorners als Schlüssel mit „false“ als Wert

    Sehen wir uns ein Codebeispiel zum Erstellen eines Dreiecksobjekts mit undurchsichtigen Kontrollecken an. Dazu müssen wir einen falschen Wert an die Eigenschaft transparentCorners übergeben.

    
    
    
    
    
    
    将透明角属性作为具有“false”值的键传递
    您可以选择三角形以查看控制角是否不透明。
    
    
    // 启动画布实例
    var canvas = new Fabric.Canvas("canvas");
    canvas.setWidth(document.body.scrollWidth);
    画布.setHeight(250);
    
    // 初始化一个三角形对象
    var triangle = new Fabric.Triangle({
    左:180,
    顶部:80,
    宽度:90,
    身高:80,
    填写:“#b0e0e6”,
    笔画:“#5f9ea0”,
    笔画宽度:7,
    透明角:假,
    });
    
    // 将其添加到画布中
    canvas.add(三角形);
    
    
    

    Beispiel 2

    Übergabe von transparentCorners als Schlüssel mit dem Wert „true“

    In diesem Beispiel übergeben wir einen wahren Wert an das Attribut transparentCorners. Dadurch wird sichergestellt, dass die Kontrollecken transparent gemacht werden. Beachten Sie, dass dies auch das Standardverhalten ist.

    
    
    
    
    
    
    将透明角作为具有“true”值的键传递
    您可以选择三角形以查看控制角是否透明。
    
    
    // 启动画布实例
    var canvas = new Fabric.Canvas("canvas");
    canvas.setWidth(document.body.scrollWidth);
    画布.setHeight(250);
    
    // 初始化一个三角形对象
    var triangle = new Fabric.Triangle({
    左:180,
    顶部:80,
    宽度:90,
    身高:80,
    填写:“#b0e0e6”,
    笔画:“#5f9ea0”,
    笔画宽度:7,
    透明角:真实,
    });
    
    // 将其添加到画布中
    canvas.add(三角形);
    
    
    

Das obige ist der detaillierte Inhalt vonWie mache ich die Kontrollecken eines Dreiecks mit FabricJS transparent?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen