Question

此问题类似于我之前的问题here，区别在于该问题的答案对我的新图表不起作用。

问题是当您尝试再次取消选中该框时，排序切换复选框会停止对图表进行排序。

如果我从d3.select("#myCheckbox")中移除该函数并将其替换为d3.select("#myCheckbox").on('change', update)，则它再次起作用，但不是移动x位置的条形图，而是仅移动x轴上的刻度线位置。酒吧同时更新并改变位置。

Answer 1

此处的问题是，您在点击复选框时重新分配sortIndex：

d3.select("#myCheckbox").on('change', function() {
    sortIndex = data.map( function(d) { return d.State} );
    update();
});

但是，它使用的data已被排序！

解决方案很简单，只需删除它：

d3.select("#myCheckbox").on('change', update);

除此之外，请确保您使用正确的按键功能：

var barGroups = g.selectAll(".layer")
    .data(data, function(d){return d.State});