javascript - 如何左对齐组中的对象

我是Fabric JS的新手。我试图通过使用此功能左对齐组中的所有对象。

$rootScope.alignLeft = function () {
    var activeObject = canvas.pages[canvas.activePageIndex].fabric.getActiveObject();
    if (activeObject.type == "group") {
        var items = activeObject._objects;
        var left = activeObject.getLeft();
        var top = activeObject.getTop();
        console.log(activeObject);
        canvas.pages[canvas.activePageIndex].fabric.remove(activeObject);
        console.log(left);
        console.log(top);
        for (var i = 0; i < items.length; i++) {
            canvas.pages[canvas.activePageIndex].fabric.add(items[i].set({left: activeObject.left}));
        }

        canvas.pages[canvas.activePageIndex].fabric.renderAll();
    }
};

我面临的问题是

1）如果我不使用.remove(activeGroup)，它会使组中的对象重复。我想保留activeGroup并以某种方式阻止其复制自身。

2）items[i].set({left : activeObject.left}正确设置了左对齐，但是对象的最高值发生了变化，我不希望这样。我尝试使用items[i].set({left : activeObject.left,top:activeObject.top});，但无法保持恒定。

我如何实现此功能？

最佳答案

我如何能够解决这些问题。我确信像我这样的fabricjs的未来新手将像我一样面临这些基本的概念问题。

对第1＆2点的答案：

1）我使用.remove（activeGroup）将其删除，并创建了一个新组，并将activeGroup中的项目添加到组中。

2）以下一些链接确实帮助我了解了fabricjs stackOverflow link Github link中使用的定位系统

$rootScope.alignLeft = function(){


            var activeObject = canvas.pages[canvas.activePageIndex].fabric.getActiveObject();
            var group = new fabric.Group();
            if(activeObject.type=="group"){
                var items = activeObject._objects;
                canvas.pages[canvas.activePageIndex].fabric.remove(activeObject);
                for(var i = 0;i<items.length;i++){
                    var ObjTop = activeObject.top + items[i].top + activeObject.height/2 ;
                    items[i].set({left :activeObject.left,top:ObjTop});
                    group.addWithUpdate(activeObject.item(i));

                }
                canvas.pages[canvas.activePageIndex].fabric.add(group);
                canvas.pages[canvas.activePageIndex].fabric.setActiveObject(group);
                canvas.pages[canvas.activePageIndex].fabric.renderAll();

            }


        }