Javascript 另一个组中的Fabricjs组

我对FabricJS中的组有问题。当我在另一个组中添加例如2个组时，我无法正确设置内部组的left和top属性。看看我的代码

字母A应位于左上角（顶部：0，左侧：0），字母B应位于A下方（顶部：50，左侧：50）

但在这个例子中，字母在中间，当我改变B的位置时，位置A也改变了

这是FabricJS中的bug吗

var canvas=newfabric.canvas（'editorCnvs'）；
函数getCell（contentTxt、fontSize、leftOffset、topOffset）{
var cellCnt=new fabric.Text（contentTxt{
fontSize:fontSize
});
var cellGrp=新结构组（[cellCnt]{
身高：50，
宽度：50，
顶部：topOffset，
左：左偏移
});
返回单元GRP；
}
var cellsArray=[]；
//它应该在左上角
推(
getCell（'A'，30，
0, 0));
推(
getCell（'B'，30，
50, 50));
var rowGrp=new fabric.Group（cellsArray{
身高：200，
宽度：200
});
canvas.add（rowGrp）
组在计算可以捕捉所有元素的边界框后自动设置其尺寸

组中的对象相对于中心进行定位

如果设置“宽度”和“高度”，将获得额外的宽度或高度分布在对象周围的效果

如果创建没有宽度和高度的组，您将看到位置得到尊重


var canvas=newfabric.canvas（'editorCnvs'）；
函数getCell（contentTxt、fontSize、leftOffset、topOffset）{
var cellCnt=new fabric.Text（contentTxt{
fontSize:fontSize
});
var cellGrp=新结构组（[cellCnt]{
顶部：topOffset，
左：左偏移
});
返回单元GRP；
}
var cellsArray=[]；
//它应该在左上角
推(
getCell（'A'，30，
0, 0));
推(
getCell（'B'，30，
50, 50));
var rowGrp=new fabric.Group（cellsArray{
});
canvas.add（rowGrp）
AndreaBogazzi您的回答对我很有帮助，但它仍然无法解决单元格维度的问题

var CELL_SIZE = 50;

function getCell(contentTxt, fontSize, leftOffset, topOffset) {
    var cellCnt = new fabric.Text(contentTxt, {
        fontSize: fontSize,
        originX: 'center',
        originY: 'center'
    });

    var cellFrameRect = new fabric.Rect({
        width: CELL_SIZE,
        height: CELL_SIZE,
        fill: 'none',
        opacity: 0,
        originX: 'center',
        originY: 'center'
    });

    var cellGrp = new fabric.Group([cellFrameRect, cellCnt], {
        top: topOffset,
        left: leftOffset
    });

    return cellGrp;
}

在你们的帮助下，我找到了答案，我将透明矩形添加到单元组中，现在我可以定义单元维度了

var CELL_SIZE = 50;

function getCell(contentTxt, fontSize, leftOffset, topOffset) {
    var cellCnt = new fabric.Text(contentTxt, {
        fontSize: fontSize,
        originX: 'center',
        originY: 'center'
    });

    var cellFrameRect = new fabric.Rect({
        width: CELL_SIZE,
        height: CELL_SIZE,
        fill: 'none',
        opacity: 0,
        originX: 'center',
        originY: 'center'
    });

    var cellGrp = new fabric.Group([cellFrameRect, cellCnt], {
        top: topOffset,
        left: leftOffset
    });

    return cellGrp;
}