Bagaimana untuk mengunci kecondongan menegak segitiga menggunakan FabricJS?

Dalam tutorial ini, kita akan belajar cara mengunci kecondongan menegak segitiga menggunakan FabricJS. Sama seperti kita boleh menentukan kedudukan, warna, kelegapan dan saiz objek segi tiga dalam kanvas, kita juga boleh menentukan sama ada kita mahu berhenti mencondongkan objek secara menegak. Ini boleh dilakukan menggunakan atribut lockSkewingY.

Syntax

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

Parameter

• Pilihan (pilihan) - Parameter ini ialah objek yang menyediakan penyesuaian tambahan kepada segi tiga kami. Menggunakan parameter ini, anda boleh menukar sifat seperti warna, kursor, lebar lejang dan banyak lagi sifat lain yang berkaitan dengan objek yang lockSkewingY ialah hartanya.

< /ul>

Kunci Pilihan

• lockSkewingY - Hartanah ini menerima nilai Boolean. Jika kita memberikan nilai "benar", kecondongan menegak objek akan dikunci. . Anda boleh mencondongkan objek secara mendatar dan menegak dengan menekan kekunci

  shift
dan kemudian menyeret secara mendatar atau menegak.

画布中 Triangle 对象的默认行为
您可以按 Shift 键并沿 X 轴或 Y 轴拖动边缘，以查看是否可以在两个方向上倾斜。


// 启动画布实例
var canvas = new Fabric.Canvas("canvas");
canvas.setWidth(document.body.scrollWidth);
画布.setHeight(250);

// 初始化一个三角形对象
var triangle = new Fabric.Triangle({
左：105，
顶部：70，
宽度：90，
身高：80，
填写：“#746cc0”，
笔画：“#967bb6”，
笔划宽度：5，
});

// 将其添加到画布中
canvas.add(三角形);

Salin selepas log masuk

Contoh 2

Melepasi lockSkewingY

sebagai kunci dengan nilai "true"

Dalam contoh ini kita akan melihat cara menggunakan lockSkewingY kebolehan sesuatu segi tiga menegak untuk menghalang objek menegak . Seperti yang kita dapat lihat, walaupun kita boleh mencondongkan objek segi tiga secara mendatar, kita tidak dibenarkan melakukan operasi yang sama secara menegak.

rreeee

Atas ialah kandungan terperinci Bagaimana untuk mengunci kecondongan menegak segitiga menggunakan FabricJS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!