使用nvd3.js在水平滑动多条形图

Question

我正在使用nvd3绘制一个多条形图，其中每个条形图对表示今年（一个条形图）和上一年（另一个条形图）中的月份值。将有12个酒吧对，每月一个标准杆。

我希望我选择的月份显示为最后一个栏，所以如果我选择4月，它会显示：may，jun，jul，aug，sep，oct，nov，dec，jan，feb，mar，apr

到目前为止，非常好，我可以按照这个顺序返回json。

问题在于，当我更改月份并更新图表时，条形图应该移动，但它们不会像我想的那样移动。我希望它们在水平方向上滑动，但相反，每个条形调整它们的高度，以便最终每个位置都可以，但视觉效果不佳。

我相信我需要设置每个栏的“键”，但我无法做到。

这是相关代码：

    d3.json(json, function(data) {
    nv.addGraph(function() {
        var chart = nv.models.multiBarChart()
            .x(function(d) { return d[0]; })
            .y(function(d) { return d[1]; })
            .color(colors)
            .forceY([0, 100])
            .reduceXTicks(false)
            .stacked(false)
            .showControls(false)
            .margin({left: 50, right: 30});

        chart.xAxis
            .showMaxMin(false)
            .tickFormat(function(d) {
                return ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'][d - 1];
            });

        chart.yAxis
            .tickFormat(function(n) {
                return d3.format('.0f')(n) + '%';
            });

        d3.select("#" + id + " .view svg")
            .data([data]/***, function(d, n) {
                return "x";
            }***/)
            .transition().duration(500).call(chart);

        nv.utils.windowResize(chart.update);

        return chart;
    });
});