Question

我有lineChart的代码

如下，

var ndx = crossfilter(data),
    dim = ndx.dimension(function(d) {return d.index;}),
    profitGrp = dim.group().reduceSum(function(d) { return d.profit});

var profitChart = dc.lineChart("#profit-chart")
    .width($("#profit-chart").parent().width())
    .height(400)
    .dimension(dim)
    .mouseZoomable(true)
    .x(d3.scale.linear()).xAxisPadding(0.25).elasticX(true)
    .group(profitGrp, "Profit")
    .renderHorizontalGridLines(true)
    .elasticY(true)
    .legend(dc.legend().x(400).y(10).itemHeight(13).gap(5))
    .margins({left: 100, right: 40, top: 40, bottom: 40})
    .brushOn(false);

但我无法放大/缩小鼠标。

我该怎么办？我认为这是因为elasticX(true)

Answer 1

对，缩放与elasticX(true)

相矛盾

如果你想要“弹性一次”的行为，一个技巧是：

chart.on('postRender', function(chart) {
    chart.elasticX(false);
});

http://dc-js.github.io/dc.js/docs/html/dc.baseMixin.html#on

Answer 2

就我而言，戈登的答案无效。因此，还有另一个方法，请尝试使用“ preRedraw”事件：

round(float(value), 3)

mouseZoomable不适用于线图上的elasticX

2 个答案: