【问题标题】:Javascript Infovis change individual node colorJavascript Infovis 更改单个节点颜色
【发布时间】:2013-10-21 03:34:26
【问题描述】:

在这种情况下,我使用的是 JIT Hypertree。我将区分一个节点的颜色与另一个节点的颜色,以便树上的每个节点都有自己的颜色。有没有办法改变单个颜色,使其与其他节点不同?

我只是设法改变了所有节点的颜色,但不是单独的。

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

【问题讨论】:

    标签: javascript colors tree infovis


    【解决方案1】:

    您必须在 Node 上将 overridable 属性设置为 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));
    });
    

    【讨论】:

    • 谢谢我已经尝试过使用你的图书馆,我想它是有益的图书馆。但更清楚的是,我希望通过节点的深度是奇数还是偶数来区分节点。为此,我必须对其级别进行迭代。所以我使用 $jit.json.eachLevel(json, 0, 3, function(node, depth) 而不是 ht.graph.eachNode(function(node).. 然而,我得到的 setData 方法没有定义。
    猜你喜欢
    • 2011-07-28
    • 2023-03-12
    • 2012-01-28
    • 2012-11-24
    • 2013-09-24
    • 1970-01-01
    • 2013-07-03
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多