8

我在 sigma.js 中有一个非常简单的示例,它读取带有一些附加数据的 gexf 文件。

// Instanciate sigma.js and customize rendering :
var sigInst = sigma.init(document.getElementById('graph-container')).drawingProperties({
    defaultLabelColor: '#fff',
    defaultLabelSize: 14,
    defaultLabelBGColor: '#fff',
    defaultLabelHoverColor: '#000',
    labelThreshold: 6,
    defaultEdgeType: 'straight'
}).graphProperties({
    minNodeSize: 0.5,
    maxNodeSize: 5,
    minEdgeSize: 1,
    maxEdgeSize: 1
}).mouseProperties({
    maxRatio: 4
});

// Parse a GEXF encoded file to fill the graph
// (requires "sigma.parseGexf.js" to be included)
sigInst.parseGexf(gexfFile);

这实际上只是取自教程。现在我想为所有节点添加一个点击事件。谁能告诉我一个正确的方法来做到这一点?

4

2 回答 2

11

根据官方文档:

s = new sigma({...});

// Bind the events:
s.bind('overNode outNode clickNode doubleClickNode rightClickNode', function(e) {
    console.log(e.type, e.data.node.label, e.data.captor);
});

https://github.com/jacomyal/sigma.js/blob/master/examples/events.html

(接受的答案对我不起作用。)

于 2015-06-30T21:32:52.560 回答
7

Step1 - 编写事件处理程序

function onClick(event) {
    window.console.log("clicked!");
} 

第 2 步 - 查找事件名称

我一直想知道事件名称可能是什么。似乎“onmouseover”、“onmousedown”等已被重命名,“onmouse”部分被截断,“节点”附加在末尾。

因此,对于单击事件,它将是“downnodes”

第 3 步 - 将处理程序链接到点击事件:

您必须使用 bind() 函数将事件处理程序绑定到事件名称。

sigInst.bind('downnodes',onClick).draw();

事件列表@ v1.0.3

感谢 Matt 提供的清单。

click、rightClick、clickStage、doubleClickStage、rightClickStage、clickNode、clickNodes、doubleClickNode、doubleClickNodes、rightClickNode、rightClickNodes、overNode、overNodes、outNode、outNodes、downNode、downNodes、upNode、upNodes - 都应该是小写的。

于 2013-03-23T17:50:49.580 回答