切换到Click事件的新数据

时间:2013-04-10 15:55:00

标签: javascript d3.js transition

我正在使用创建水平条形图的代码,我已经通过here访问并修改了一些以满足我的需求。

我希望在点击其中一个栏后转换到新数据集。

例如,如果有人点击美国,我想渲染一个具有美国州名及其价值的新图表。

这是初始数据集

var countries = ['India', 'America', 'China', 'Russia', 'London'],
    value = [8, 4, 9, 12, 11];

这就是我希望它在点击美国或4栏时转换到

var AmericaS = ['MA','CA','NH'],
AmericaV = [10,9,11];

这是我到目前为止的代码的jsfiddle:

jsfiddle

我一直在尝试不同的方法来做到这一点,但似乎没有任何工作。我非常感谢你能给我的任何帮助。

1 个答案:

答案 0 :(得分:0)

看看M.Bostocks' example,如果我是正确的,那就像你想要做的那样。看一下页面源代码,用于绘制图形的代码。

如果你想要一个通过的数据示例 -

var demoArray = {
    "name" : "aa",
    "children" : [{
        "name" : "analytics",
        "children" : [{
            "name" : "cluster",
            "children" : [{
                "test" : 'aaa',
                "name" : "AgglomerativeCluster",
                "size" : 3938
            }, {
                "test" : 'aaa',
                "name" : "CommunityStructure",
                "size" : 3812
            }, {
                "test" : 'aaa',
                "name" : "MergeEdge",
                "size" : 743
            }]
        }, {
            "name" : "graph",
            "children" : [{
                "test" : 'aaa',
                "name" : "BetweennessCentrality",
                "size" : 3534
            }, {
                "test" : 'aaa',
                "name" : "LinkDistance",
                "size" : 5731
            }]
        }]
    }]
};

将页面源代码的第72-76行替换为这样,

hierarchy.nodes(demoArray);
x.domain([0, demoArray.value]).nice();
down(demoArray, 0);

或者只是把它放到JSON数组中。

希望这对你有帮助,如果不是道歉:D