javascript - d3.js 仪表板在鼠标悬停时反转数据

Question

我使用的是 d3.js 网站上的仪表板示例 here .

我稍微修改了它以满足我的需要，但是，当我将鼠标悬停在直方图上时，我看到低和高计数颠倒了，也就是说，低计数变成了高计数，反之亦然。

This是我面临的问题的一个小问题。正如您所看到的，最初，Low 的计数为 12，High 的计数为 0。但是当鼠标悬停在蓝色直方图上时，Low 的计数变为 0，High 的计数变为 12。

您是否了解为什么会发生这种情况以及我该如何纠正它？

Answer 1

您正在更改数据结构:

var freqData=[{"State":"apache-client-utils","freq":{"High":0,"Critical":0,"Low":12,"Medium":0}}];

还有

 var tF = ['Low','Medium','High','Critical'].map(function(d){
        return {type:d, freq: d3.sum(fData.map(function(t){ return t.freq[d];}))};
    });

虽然我没有仔细观察，但将 freqData 更改为:

    var freqData=[{"State":"apache-client-utils","freq":{"Low":12,"Medium":0,"High":0,"Critical":0}}];

据我所知，将解决反转问题。