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

在本教學中，我們將學習如何使用 FabricJS 來使三角形的控制角透明。三角形是 FabricJS 提供的各種形狀之一。為了創建一個三角形，我們必須建立一個 Fabric.Triangle 類別的實例並將其新增到畫布中。transparentCorners屬性允許我們使三角形的控制角透明。

語法

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

參數

• #選項（可選）- 此參數是一個物件，它為我們的三角形提供額外的自訂。使用此參數，可以變更與transparentCorners為屬性的物件相關的屬性，例如顏色、遊標、描邊寬度和許多其他屬性。

< /ul>

選項鍵

• transparentCorners- 該屬性接受一個布林值，允許我們將物件的控制角渲染為透明或不透明。其預設值為 true。

範例1

將transparentCorners屬性作為帶有「false」的鍵傳遞value

#讓我們來看一個程式碼範例，用於建立一個具有不透明控制角的三角形物件。為此，我們需要向transparentCorners屬性傳遞一個 false 值。

将透明角属性作为具有“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(三角形);

登入後複製

範例2

將transparentCorners作為具有「true」值的鍵傳遞

在此範例中，我們向transparentCorners屬性傳遞一個真值。這將確保控制角呈現為透明。請注意，這也是預設行為。

将透明角作为具有“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(三角形);

登入後複製

以上是如何使用 FabricJS 讓三角形的控制角透明？的詳細內容。更多資訊請關注PHP中文網其他相關文章！