Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menjadikan sudut kawalan segitiga telus menggunakan FabricJS?

Bagaimana untuk menjadikan sudut kawalan segitiga telus menggunakan FabricJS?

WBOY
WBOYke hadapan
2023-09-17 23:13:061526semak imbas

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

Dalam tutorial ini, kita akan belajar cara membuat sudut kawalan segitiga telus menggunakan FabricJS. Segitiga adalah salah satu daripada pelbagai bentuk yang disediakan oleh FabricJS. Untuk mencipta segi tiga, kita mesti mencipta contoh kelas Fabric.Triangle dan menambahkannya pada kanvas. sudut telus harta membolehkan kami menjadikan sudut kawalan segitiga itu telus.

Syntax

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

Parameter

  • #🎜Parameter#🎜#🎜#🎜#Pilihan Pilihan) - Parameter ini ialah objek yang menyediakan penyesuaian tambahan pada segi tiga kami. Menggunakan parameter ini, anda boleh menukar sifat yang berkaitan dengan objek yang

    transparentCorners
  • ialah atribut, seperti warna, kursor, lebar lejang dan banyak sifat lain.

      Kunci pilihan
    • #🎜🎜 #Sudut telus terima#s #🎜🎜 Hartanah ini 🎜#Boolean nilai yang membolehkan kami menjadikan sudut kawalan objek sebagai lutsinar atau legap. Nilai lalainya adalah benar.

    Contoh 1

    Lulus Sudut telus#🎜 sebagai nilai🎜 dengan kunci "#palsu" Mari kita lihat contoh kod untuk mencipta objek segi tiga dengan sudut kawalan legap. Untuk melakukan ini, kita perlu memberikan nilai palsu kepada harta

    transparentCorners

    .

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

    Lulus

    Sudut telus sebagai kunci dengan nilai "sebenar" #🎜#🎜 Dalam contoh ini, kami memberikan nilai sebenar kepada harta transparent Corners. Ini akan memastikan sudut kawalan dibuat telus. Ambil perhatian bahawa ini juga merupakan tingkah laku lalai.

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

Atas ialah kandungan terperinci Bagaimana untuk menjadikan sudut kawalan segitiga telus menggunakan FabricJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam