过滤我的数据会导致y轴搞砸

Question

我正在创建一个带有d3的柱形图。我有263个数据点，并显示所有列使得图表过于拥挤。为了过滤数据点，我只需抓取每个第n项（从数组的后面开始，所以我确保我得到最新的数据点）。

我定义Y轴的刻度值，以包括来自未过滤数据集最低和最高，所以用户可以看到的数据集的真实 min和max。余计算最小和最大之前予筛选数据：

var v = new Array(); 
data.forEach(function (d) { 
    d.date = parseDate(d.date); 
    d.close = +d.close; 
    v.push(d.close); // v holds ALL our values...before we filter them 
}); 
yAxisValues = [Math.min.apply(null, v),Math.max.apply(null, v)]; 

if(data.length > 100){ // make it so that the chart isn't as crowded 

     var len = data.length; 
     var n = Math.round(len/100); // ideally, we want no more than 100 items 

     var tempData = []; 
     data = data.reverse(); 

     for(var k = 0; k < len; k += n){ 

      tempData.push(data[ k ]); 
     } 
     data = tempData; 
     data = data.reverse(); 
    } 

然而，现在我的y轴被拧起来，用-0.02表示在x轴的下方。我做错了什么？我的fiddle。 （为平常见到的y轴的行为，只是注释掉，我筛选数据的部分）的过滤之前，您正在创建你的Y轴值

Answer 1

，但你仍然在过滤创建规模数据：

var y = d3.scale.linear().range([height - 5, 5]); 
// here is where it look at the min/max of the filtered data rather than the min/max of the original 
y.domain(d3.extent(data, function (d) { 
    return d.close; 
})); 
var yAxis = d3.svg.axis().scale(y).orient('left').tickValues(yAxisValues); 

如果您在过滤之前移动此部分，则应该可以。