FabricJSを使用してTriangleの垂直スケーリングをロックするにはどうすればよいですか?

このチュートリアルでは、FabricJS を使用して三角形の垂直方向のスケーリングをロックする方法を学びます。キャンバス内の三角形オブジェクトの位置、色、不透明度、サイズを指定できるのと同じように、オブジェクトの垂直方向の拡大縮小を停止するかどうかも指定できます。これは、lockScalingY プロパティを使用して実行できます。

構文

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

パラメータ

• オプション (オプション) - このパラメータは Object は、三角形に追加のカスタマイズを提供します。このパラメーターを使用すると、lockScalingY が属性であるオブジェクトに関連するプロパティ (色、カーソル、ストローク幅、その他の多くのプロパティなど) を変更できます。

< /ul>

オプション キー

• lockScalingY - このプロパティは ブール値##を受け入れます＃ 価値。 「true」値を指定すると、オブジェクトの垂直方向のスケーリングがロックされます。

#例 1
#キャンバス内の Triangle オブジェクトのデフォルトの動作

コード例を見て理解しましょう。

lockScalingY

プロパティが使用されていない場合の Triangle オブジェクトのデフォルトの動作。オブジェクトを水平方向および垂直方向に拡大縮小することができます。

画布中 Triangle 对象的默认行为
您可以在水平和垂直方向上缩放三角形，以验证是否可以在两个方向上缩放。


// 启动画布实例
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(三角形);

ログイン後にコピー
例 2
値が「true」のキーとして

lockScalingY を渡す この例では、 lockScalingY プロパティを使用して、Triangle オブジェクトの垂直方向の拡大縮小機能を停止する方法を学びます。ご覧のとおり、三角形オブジェクトを水平方向に拡大縮小することはできますが、同じ操作を垂直方向に行うことはできません。

えええええ

以上がFabricJSを使用してTriangleの垂直スケーリングをロックするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。