javascript - 根据单独的总和正确创建工具提示

Question

继续我的最后一个问题，我在工具提示方面遇到了问题。我需要有人向我解释这个概念，或者将我重定向到正确的位置。

我需要工具提示来显示总和(或者只是显示条形现在的值。这是一个有效的 JSFiddle: http://jsfiddle.net/zs97ozzb/1/

这里是我的提示的定义位置(我使用的是 d3.tip):

var tip = d3.tip()
    .attr('class', 'd3-tip')
    .offset([-10, 0])
    .html(function(d) {
        return "<span style='color:red'>" + d3.format("$,")(d.values.reduce(function(sum, d){
            return sum + d.amount;
        })) + "</span>";
    })

Answer 1

对您的代码发出警报:

return "<span style='color:red'>" + d3.format("$,")(d.values.reduce(function(sum, d){
            alert (sum);   <====
            return sum + d.amount;
        })) + "</span>";

你会看到一个字符串连接......到目前为止，你还没有求和。

更改为:

return "<span style='color:red'>" + d3.format('$,') (d.values.reduce(function(sum, d){
            return sum + d.amount;
        },0)) + "</span>";

你错过了“,0”初始值，如果 sum 有垃圾，你可以用它进行字符串连接。显然它是 NaN。

您可以检查 Array.prototype.reduce() sintaxis here

新的jsFiddle:http://jsfiddle.net/shv2Loa0/

现在可以工作了。希望这有帮助