📅 最后修改于: 2023-12-03 15:30:43.969000 🧑 作者: Mango
Fabric.js是一款用于创建交互式Web应用程序的JavaScript库。它是一个基于canvas元素的图形编辑器，支持各种功能，包括文本、图像、圆形、直线、箭头等。此外，它还支持拖放、缩放、旋转、裁剪、层级管理等操作。
在Fabric.js中，组（Group）是一种常用的元素，它可以将其他元素组合在一起，并对它们进行统一的操作。组的顶部属性（Top Property）是指与组直接相关的属性，它们可以在组对象的顶部方法中访问和操作。
group.top属性是指组在画布上的顶部位置，它通过设置或获取组元素的顶部位置，来控制组的垂直定位。它的默认值为0，即在画布的最上方。
var group = new fabric.Group([rect1, rect2, rect3]);
var top = group.top; // 获取top属性值
group.top = 100; // 设置top属性值
group.setTop(value)方法用于设置组在画布上的顶部位置，它可以通过value参数设置要设置的top值。它返回组对象本身。
var group = new fabric.Group([rect1, rect2, rect3]);
group.setTop(100); // 设置top属性值
group.moveToTop()方法可以让组在画布中移动到最顶部，它不需要任何参数，并且返回组对象本身。
var group = new fabric.Group([rect1, rect2, rect3]);
group.moveToTop(); // 组移动到最顶部
group.bringToFront()方法是让组在画布中移动到顶部，它与group.moveToTop()方法的作用是一样的。它不需要任何参数，并且返回组对象本身。
var group = new fabric.Group([rect1, rect2, rect3]);
group.bringToFront(); // 组移动到最顶部
group.sendToBack()方法是让组在画布中移动到最底部，它不需要任何参数，并且返回组对象本身。
var group = new fabric.Group([rect1, rect2, rect3]);
group.sendToBack(); // 组移动到最底部
group.moveDown()方法是让组在画布中向下移动一层，它不需要任何参数，并且返回组对象本身。
var group = new fabric.Group([rect1, rect2, rect3]);
group.moveDown(); // 组向下移动一层
group.moveToIndex(index)方法是让组在画布中移动到指定的层级，它需要一个整数类型的参数index，表示移动到的层级。它返回组对象本身。
var group = new fabric.Group([rect1, rect2, rect3]);
group.moveToIndex(1); // 组移动到第二层级
组顶部属性是一些与组直接相关的属性，它们可以用于控制组在画布中的显示顺序。这些顶部属性包括top、setTop、moveToTop、bringToFront、sendToBack、moveDown、moveToIndex等方法。在实际应用中，可以根据需求进行调整，从而实现更加灵活的操作。