在d3.js中读取json数据

时间:2014-06-17 06:42:10

标签: javascript json d3.js

我在d3.js中创建了一个堆积图表。从文件中读取数据。现在我想从json读取。为了从json读取,我需要做些什么改变。

    Below is code for the chart.

    d3.tsv("./StackedChart/stackeddata_dept1.tsv", type, function(error, data) {
    x_stacked.domain(data.map(function(d) { return d.department; }));
    y0_stacked.domain([0, d3.max(data, function(d) { return 100; })]);

    svg1.append("g")
            .attr("class", "x axis")
            .attr("transform", "translate(0," + height_stacked + ")")
            .call(xAxis_stacked);

    svg1.append("g")
            .attr("class", "y axis axisLeft")
            .attr("transform", "translate(0,0)")
            .call(yAxisLeft_stacked)
            .append("text")
            .attr("y", 6)
            .attr("dy", "-2em")
            .style("text-anchor", "end")
            .style("text-anchor", "end");

    bars = svg1.selectAll(".bar").data(data).enter();

    bars.append("rect")
            .attr("class", "bar1")
            .attr("x", function(d) { return x_stacked(d.department); })
            .attr("width", x_stacked.rangeBand()/2)
            .attr("y", function(d) { return y0_stacked(d.positive); })
            .attr("height", function(d,i,j) { return height_stacked - y0_stacked(d.positive); });
});

function type(d) {
    d.positive = +d.positive;
    return d;
}

文件中的数据是:

部门积极消极 金融63.5299997329712 36.9699997901917
HR 43.6424999237061 56.3575010299683
生产43.1399993896484 57.0625009536743 销售65.1949987411499 34.8049998283386

任何帮助表示赞赏。 我需要知道的是,为了从json读取,需要对代码进行哪些更改。 现在数据将在json中,而不是在文件中。 有什么方法可以在d3中读取数据而不是使用文件?

1 个答案:

答案 0 :(得分:0)

您目前正在使用 d3.tsv()从tsv文件中读取。

要读取JSON文件,您必须使用d3.json()方法