如何使用json对象形成条形图

时间:2014-11-20 16:41:31

标签: javascript html5 css3 d3.js

我正在尝试使用下面的json对象形成条形图。但是,我无法形成条形图 任何人都可以告诉我下面的对象有什么问题

var data = {
    "nag": {
        "name": "madhu",
        "qfy": "mca",
        "year": 2011
    },
    "kiran": {
        "name": "thirapthi",
        "qfy": "mca",
        "year": 2011
    },
    "reddy": {
        "name": "reddy",
        "qfy": "mca",
        "year": 2011
    }
}

d3.json("Data.json", function(data) {
    var s = Object.keys(data);
    s.forEach(function(keys) {
        var s1 = Object.keys(data[keys]);
        s1.forEach(function(value) {
            var value = data[keys][value];


            var canvas = d3.select("body").append("svg")
                .attr("height", 500)
                .attr("width", 500)
            var svg = canvas.selectAll(".bar")
                .data(s)
                .enter()
                .append("rect")
                .attr("class", "bar")
                .attr("x", function(d, i) {
                    return d.value;
                })
                .attr("y", function(d) {
                    return d.name;
                })
                .attr("height", function(d, i) {
                    return i;
                })
                .attr("width", function(d, i) {
                    return i * 5;
                })
                .style("fill", "blue");
        })

    })
});       

0 个答案:

没有答案