2013-03-26 2 views
2

w/d3 세로 막 대형 차트를 만듭니다. 데이터 포인트가 263 개이며 모든 열을 표시하면 차트가 너무 복잡해집니다. 데이터 포인트를 필터링하기 위해, 배열의 역순으로 시작하여 모든 n 번째 항목을 가져 오기만하면 가장 최근의 데이터 포인트를 얻을 수 있습니다.내 데이터를 필터링하면 y 축이 엉망이됩니다.

는 I은 필터링되지 않은 세트로부터 최소 및 최대를 포함하도록 Y 축 눈금 값을 정의하므로, 사용자는 데이터 세트의 실제 최소 및 최대를 볼 수있다.

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 축 아래에 나타내는 최대 나사 결합된다 : I은 데이터를 필터링하기 전에 I는 최소 및 최대를 계산한다. 나는 무엇을 잘못 했는가? 내 fiddle. 당신은 필터링하기 전에 Y 축 를 만드는

답변

1

(일반적으로 y 축 동작합니다를 참조하려면 내가 데이터를 필터링하는 부분을 주석),하지만 당신은 여전히 ​​필터링에 규모를 만드는 데이터 :

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); 

필터링하기 전에이 부분을 움직이면 괜찮을 것입니다.

+0

그런 간단한 해결책을 위해이 문제를 얼마나 낭비했는지 놀랍습니다. 감사! –

관련 문제