在组合条形图和折线图上使用滑块答案

【问题标题】：Using slider on combined bar and linechart在组合条形图和折线图上使用滑块
【发布时间】：2015-04-22 13:34:16
【问题描述】：

我成功地在 d3.js 中构建了一个结合了条形图和折线图的图表，并在其中添加了一个滑块来更新 x 轴，但不更新图表本身。到目前为止，我所有的尝试都失败了。我发现了一个非常好的例子，它有点相似：http://bl.ocks.org/dem42/3878029

我做了一个小提琴，在这里查看：http://jsfiddle.net/karolinka/zpy0pqLu/10/ 感谢您提前考虑。这是滑块函数中的代码：

        x.domain(d3.range(minv, maxv + 1));
        xAxis.tickFormat(function(i) {
            return times[i];
        });
        svg.transition().duration(750)
            .select(".x.axis").call(xAxis);

        lineScaleX.domain(d3.range(minv, maxv + 1));
        svg.transition().duration(750)
            .select(".lines").attr("d", line);

【问题讨论】：

我知道现在是什么问题，只需要想办法解决它。图表有一个序数比例，但他的滑块 ui 值正在返回我必须再次转换为字符串的数字。
更新：它越来越好，但仍然有来自旧域的酒吧：jsfiddle.net/karolinka/zpy0pqLu/28

标签： javascript jquery d3.js data-visualization

【解决方案1】：

如果有人感兴趣：线插值不好，但现在可以使用：http://jsfiddle.net/karolinka/zpy0pqLu/40/。最后我用 JQuery 隐藏了额外的元素像这样：

if(newtimes.length<5){
   $(".bars:nth-child(5)").hide();
} else {
    $(".bars:nth-child(5)").show();
}``

我猜这不是最好的方法，但如果我删除旧元素然后再次附加它们，我将无法顺利过渡。

【讨论】：