Javascript Infovis更改单个节点颜色

时间:2013-10-21 03:34:27

标签: javascript colors tree infovis

在这种情况下,我正在使用JIT Hypertree。我将区分节点的颜色与其他节点的颜色,以便树上的每个节点都有自己的颜色。无论如何都要改变个别颜色,以便与其他节点不同?

我只是设法改变所有节点的颜色,但不是个人。

 Node: {
   dim: 9,
   color: "#009933" 
 },

1 个答案:

答案 0 :(得分:1)

您必须在Node上将可覆盖的属性设置为true。

Node: {
    dim: 9,
    overridable: true 
},

然后,在加载数据之后和绘制之前,迭代节点并使用 setData 来设置各个颜色。这里的an example使用随机颜色,但你也可以将颜色插入你的JSON数据并从那里拉出来:

ht.graph.eachNode(function(node) {  
    node.setData('color', "hsl("+Math.random()*360+",100%,50%)");
});

现在,无耻的插件:我写了a library来生成基于ID的颜色。因此,如果您不想手工挑选颜色,并且您希望颜色与数据具有持久的关系,那么它会有所帮助。 Here's the example使用它。

ht.graph.eachNode(function(node) {  
    node.setData('color', $.fn.autumn.getColor(node.id));
});