Question

我正在尝试使用d3制作饼图。为此，我将我的数据以JSON格式发送到我的视图，然后我想尝试总计三个参数，然后在饼图中使用这些参数。到目前为止，我已设法将数据提供给视图，但现在我需要使用foreach来累计参数。我现在只处理一个。

脚本：

   var width = 960,
    height = 500,
    radius = Math.min(width, height) / 2;

        var color = d3.scale.ordinal()
            .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c"]);

        var arc = d3.svg.arc()
            .outerRadius(radius - 10)
            .innerRadius(0);

        var pie = d3.layout.pie()
            .sort(null)
            .value(function (d) { return d.Query; });

        var svg = d3.select("body").append("svg")
            .attr("width", width)
            .attr("height", height)
          .append("g")
            .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

        var data = @Html.Raw(@Model.output);

        var QueryTotal = data.forEach(function(d) {
            d.Query = +d.Query;
        });

        console.log(QueryTotal);

            var g = svg.selectAll(".arc")
                .data(pie(data))
              .enter().append("g")
                .attr("class", "arc");

            g.append("path")
                .attr("d", arc)
                .style("fill", function (d) { return color("Query"); });

            g.append("text")
                .attr("transform", function (d) { return "translate(" + arc.centroid(d) + ")"; })
                .attr("dy", ".35em")
                .style("text-anchor", "middle")
            .text(function (d) { return "Query"; });

我如何使用a来计算每个值的总和，我已经给出了一个你可以在上面看到的尝试。它只返回undefined。

Answer 1

要对值求和，请使用reduce()

if (value.item(j).getAttributes().getNamedItem("column").getNodeValue().equals(where)) {
    String s = value.item(j).getTextContent();
    Log.d("DataStore", "Node Value: " + s + " length: " + s.length() + " equal to: " + equalTo + " length: " + equalTo.length());
    compareStr( s, equalTo );
    if (s.equalsIgnoreCase(equalTo)) {
        dataNode.removeChild(rows.item(i));
        count++;
    }
}

或者，使用现有结构：

var QueryTotal = data.reduce(function(prev, d) {
    return prev + d.Query;
}, 0);

Answer 2

D3的方法是使用d3.sum()：

var QueryTotal = d3.sum(data, function(d) { return d.Query; });

如何使用Javascript在d3中使用forEach

2 个答案: