Question

你能否帮我在Fabric对象上创建一个上下文菜单。我google了很多但找不到确切的解决方案。我在面料上创建了如下两个对象。如何将上下文菜单绑定到结构对象？小提琴链接：http://jsfiddle.net/fabricjs/S9sLu/

canvas.add(new fabric.Rect({ 
  left: 100, 
  top: 100, 
  width: 50, 
  height: 50, 
  fill: '#faa', 
  originX: 'left', 
  originY: 'top',
  centeredRotation: true
}));

canvas.add(new fabric.Circle({ 
  left: 300, 
  top: 300, 
  radius: 50, 
  fill: '#9f9', 
  originX: 'left', 
  originY: 'top',
  centeredRotation: true
}));

提前致谢。

Answer 1

我使用contextMenu.js，这应该让你开始：

function contextMenu () {
    var ctxTarget = null;

    var menu = [{
        name: 'Select Object',
        img: '',
        title: 'Select Object',
        fun: function (o, jqEvent) {
            canvas.setActiveObject(ctxTarget);
            console.log(ctxTarget);
        }
    }];

    $('.upper-canvas').on('contextmenu', function (e) {
        e.preventDefault();
        ctxTarget = canvas.findTarget(e.originalEvent);
    });

    $('.upper-canvas').contextMenu(menu, {
        triggerOn: 'contextmenu',
        closeOnClick: true,
    });
}

关于fabricjs中对象的Contextmenu

1 个答案: