在本教程中，我们将使用 fabricjs 设置矩形的旋转角度。矩形是 fabricjs 提供的各种形状之一。为了创建一个矩形，我们必须创建一个fabric.rect类的实例并将其添加到画布中。
angle属性fabricjs 中定义了对象的 2d 旋转角度。我们还有 centeredrotation 属性，允许我们使用矩形的中心点作为变换的原点。
语法new fabric.rect({ angle: number, centeredrotation: boolean }: object)
parameters选项（可选） - 此参数是一个对象，它为我们的长方形。使用此参数，可以更改与角度和 centeredrotation 为属性的矩形相关的颜色、光标、描边宽度等属性以及许多其他属性。
选项键角度 - 此属性接受指定的数字矩形的旋转角度（以度为单位）。
centeredrotation - 该属性接受一个布尔值，该值确定是否矩形的中心是否为变换原点。
示例 1将角度作为具有自定义值的键传递并禁用矩形的居中旋转
让我们看一个在 fabricjs 中设置矩形旋转角度的代码示例。负角度指定逆时针方向，而正角度指定顺时针方向。由于我们为 centeredrotation 分配了一个 false 值，因此矩形将在使用其角点作为旋转中心的同时进行旋转。
将角度作为带有自定义值的键并禁用矩形的居中旋转旋转矩形可以看到其居中旋转已被禁用。// 启动画布实例var canvas = new fabric.canvas(canvas);canvas.setwidth(document.body.scrollwidth);画布.setheight(250);// 初始化一个矩形对象var 矩形 = 新的布料. 矩形({左：125，顶部：90，宽度：170，身高：70，填写：“#cf1020”，居中旋转：假，角度：15，});// 将其添加到画布中canvas.add(矩形);
示例2启用矩形的居中旋转
从这个示例中我们可以看到，通过设置centeredrotation 属性为 true，我们的矩形现在使用其中心作为旋转中心。在 1.3.4 版本之前，centeredscaling 和 centeredrotation 包含在一个名为centertransform。
启用矩形的居中旋转旋转矩形以查看已启用居中旋转。// 启动画布实例var canvas = new fabric.canvas(canvas);canvas.setwidth(document.body.scrollwidth);画布.setheight(250);// 初始化一个矩形对象var 矩形 = 新的布料. 矩形({左：125，顶部：90，宽度：170，身高：70，填写：“#cf1020”，居中旋转：true，角度：15，}); // 将其添加到画布中canvas.add(矩形);
以上就是如何使用 fabricjs 设置矩形的旋转角度？的详细内容。