首頁 > web前端 > js教程 > 主體

FabricJS – 如何將 Line 物件在繪製物件堆疊中向下移動一步?

WBOY
發布: 2023-09-10 14:01:11
轉載
1177 人瀏覽過

FabricJS – 如何将 Line 对象在绘制对象堆栈中向下移动一步?

在本教程中,我們將學習如何使用 FabricJS 將 Line 物件在繪製物件堆疊中向下移動一步。 Line 元素是 FabricJS 中提供的基本元素之一。它用於創建直線。由於線元素在幾何上是一維的並且不包含內部,因此它們永遠不會被填充。我們可以透過建立 fabric.Line 實例來建立線條對象,指定線條的 x 和 y 座標並將其新增至畫布。為了將 Line 物件在繪製物件堆疊中向下移動一步,我們使用 sendBackwards 方法。

語法

 sendBackwards(intersecting: Boolean): fabric.Object 
登入後複製

參數

  • #相交 - 此參數接受布林值當指定為「true」值時,會將物件傳送到下一個較低的相交物件後面。如果值為“false”,它通常會將物件傳送到堆疊中下一個物件後面。此參數是可選的。

使用sendBackwards方法

範例

讓我們看一個程式碼範例來查看使用sendBackwards 方法時的輸出。 sendBackwards 方法將物件在繪製物件堆疊中向下移動一步。在本例中,使用 sendBackwards 方法,line2 在 line1 之後發送。




   
   

Using sendBackwards method

You can see that line2 (red) has been moved down in the stack of drawn objects

登入後複製

使用 sendBackwards 方法並啟用三個物件並啟用交集鍵

範例

在此範例中,我們使用了三個線條對象,分別是 line1、line2line3。儘管它們已按照數字順序添加到畫布中,但 line3 顯然位於 line1 後面。這是因為我們使用了啟用了交集鍵的sendBackwards 方法,該方法將line3 傳送到其下一個較低的相交物件(即line1)後面。 p>




   
   

Using sendBackwards method with three objects and intersection key enabled

You can see that the green line now lies behind the blue line which is line number 1

登入後複製

以上是FabricJS – 如何將 Line 物件在繪製物件堆疊中向下移動一步?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:tutorialspoint.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!