Question

我正在为一个小项目构建一个带有jointjs和raphael的小型uml建模器我正在做...我已经通过点击一个按钮绘制了类。

我特别想知道的是如何让onclick事件处理jointjs类图表，因为当我点击它们不起作用的类时，当我点击它们时它们会移动一点，如果我能得到它onclick工作我可能会点击对象并在背景上画线...

关于如何绘制线条的任何其他想法......可能是从一个类拖到另一个类？

有没有人这样做过？

谢谢！

Answer 1

这是jointjs 0.6的示例代码，诀窍是使用model-id属性来使用jquery选择对象：

        var rect = new joint.shapes.basic.Rect({
        position: { x: 100, y: 30 },
        size: { width: 100, height: 30 },
        attrs: { rect: { fill: 'blue' }, text: { text: 'my box', fill: 'white' } }
    });


    graph.addCells([rect]);

    //here is the trick
    $("g[model-id='" +rect.id+ "']").click(function() {
        alert("x");
    });

Answer 2

jointjs提供事件调用功能。您可以在纸质div上调用事件。这是一个例子。可能这可以帮到你。有关更多信息，请转到链接。 List of triggered events on Paper 代码示例：

paper.on('cell:pointerdblclick',function(cellView, evt, x, y) {
     demo();
  });

function demo(){
 alert("1");
}

我希望这会给你提供帮助。谢谢

Answer 3

我不认为你可以将事件绑定到图表元素的鼠标点击，因为鼠标点击事件已经被联合lib本身绑定。

但是，你绝对可以绑定mousedown / mouseup事件来模拟点击。您可以通过单击一个元素（将关节对象放在temp var中）然后单击另一个元素来实现连接创建 - 调用

var joint= element.joint(other_element,connection_type)

希望它有所帮助，如果您需要更多，请告诉我。

通过网络与jointjs绘制线条

3 个答案: