0

我正在尝试实现流可视化图，如谷歌流可视化。请为此类实现建议任何 API。任何帮助将不胜感激。

编辑：我使用sankey 图来实现这个要求。下面是我的代码：

$(document).ready(function() {

    var dataArray = [["India \n 40","United States \n 25","Canada \n 20","Hong Kong \n 15"],
                     ["page1 \n 50","page2 \n 30","about_us.htm \n 20"],
                     ["page2 \n 50","contactus.htm \n 15"],
                     ["page1 \n 50"]];

    var sankey = new Sankey();

    for(var i=0; i< dataArray.length; i++) 
    sankey.stack(i,dataArray[i]); 

    sankey.setData([["India \n 40",20,"page1 \n 50"],["United States \n 25",10,"page1 \n 50"],["Canada \n 20",10,"page1 \n 50"],["Hong Kong \n 15",10,"page1 \n 50"],["India \n 40",10,"page2 \n 30"],["United States \n 25",10,"page2 \n 30"],["Canada \n 20",5,"page2 \n 30"],["Hong Kong \n 15",5,"page2 \n 30"],["India \n 40",10,"about_us.htm \n 20"],["United States \n 25",5,"about_us.htm \n 20"],["Canada \n 20",5,"about_us.htm \n 20"],
                    ["page1 \n 50",35,"page2 \n 50"],["page2 \n 30",15,"page2 \n 50"],["page1 \n 50",10,"contactus.htm \n 15"],["page2 \n 30",5,"contactus.htm \n 15"],
                    ["page2 \n 50",40,"page1 \n 50"]
                    ]);

    sankey.setBubbles([["page1 \n 50", 5],["page2 \n 30",10],["about_us.htm \n 20",20],["contactus.htm \n 15",15],["page2 \n 50",10]]);

    sankey.bubbleColor = "#F37126";
    sankey.bubbleLabelColor = "#FFF";
    sankey.draw();
});

在上面的示例中，我在第一次和第三次交互中有“ page1 \n 50 ” 。为此，它将在第三次交互中仅创建一个节点。如何克服这个问题。请帮帮我。

提前致谢

4

2 回答 2

0

问题是你不能用 sankey 做到这一点。您可以在数据中添加一些其他数据，例如堆栈号，以便减少重复。这就是我正在做的事情。它只是意味着我的对象在 sankey 图表中都没有相同的名称。

于 2014-01-21T07:21:14.787 回答
0

看起来你想要的是一个桑基图。

于 2013-07-02T08:33:23.667 回答