如何在Graphiti.js的矩形上添加点击事件

Question

我想在graphiti的矩形上注册点击事件。我试过这个

var innerrect = new graphiti.shape.basic.Rectangle(100, 20); 
     innerrect.onClick = function(){ 
      alert("Hi"); 
     } 
rect.addFigure(innerrect , new graphiti.layout.locator.BottomLocator(rect)); 
canvas.addFigure(rect, 100, 100); 

但不会工作。让我知道毗邻吗？

Answer 1

像这样创建自己的形状从Rectangle继承。 这看起来有点不舒服，但通常你会用自己的形状写出很多自定义代码。在这种情况下，创建一个新班级是一次努力。

请记住，这些例子是一个很好的起点。还有一个点击事件侦听器的例子。

MyFigure = graphiti.shape.basic.Rectangle.extend({ 

NAME : "MyFigure", 

init : function() 
{ 
    this._super(); 

    this.createPort("output"); 
    this.setDimension(30,30); 
    this.setResizeable(false); 

    this.value=false; 

    this.colors={}; 
    this.colors[true]="#00f000"; 
    this.colors[false]="#f00000"; 

    this.setBackgroundColor(this.colors[this.value]); 
}, 

/** 
* @method 
* Change the color and the internal value of the figure. 
* Post the new value to related input ports. 
* 
*/ 
onClick: function(){ 
    this.value = !this.value; 
    this.setBackgroundColor(this.colors[this.value]); 

    var connections = this.getOutputPort(0).getConnections(); 
    connections.each($.proxy(function(i, conn){ 
     var targetPort = conn.getTarget(); 
     targetPort.setValue(this.value); 
     conn.setColor(this.getBackgroundColor()); 
    },this)); 
} 

});