jQuery flot - 가변 범위 차트에서 텍스트가 넘치지 않는 시간 축 눈금 레이블에 맞 춥니 다

Question

일별 데이터 샘플이 포함 된 간단한 플롯 꺾은 선형 차트가 있습니다. 그러나 범위는 사용자가 선택할 수 있습니다 (2 일에서 수년의 데이터까지).

var chartConfig = { 
    xaxis: { 
     mode: "time", 
     timeformat: "%Y/%m/%d" 
    } 
}; 

$.plot($("#chart"), readings, chartConfig); 

I은 ​​X 축 (예 2013년 7월 15일) 날짜를 표시 할 틱하지만 라벨 텍스트 케이되도록 균일하게 표시하는 범위에 걸쳐 분산 틱의 적절한 수에 대해 원하는 오버플로 (예 : 10 tick).

은 내가 minTickSizeTICK을 및 검토 한 그러나 이들은 '가이드 라인'만 - 그들은이 사용 사례에 영향을 미치지 않는다 4 틱 위의.

Answer 1

결국 데이터 범위에 관계없이 고정 된 수의 틱을 표시하기 위해 직접 작성했습니다.

틱을 표시 할 샘플의 간격을 계산 한 다음 모듈로 연산자를 사용하여 샘플 틱을 표시할지 여부를 테스트합니다.

var ticks = []; 
var tick_count = 7; //number of ticks to show 
var sample_count = readings[0].data.length; 
var display_interval = Math.round((sample_count/tick_count)); 
for (var i = 0; i < sample_count; i++) { 
    if((i % display_interval) == 0) { 
     ticks.push(readings[0].data[i][0]); 
    } 
} 
chartConfig.xaxis.ticks = ticks; 
$.plot($("#chart"), readings, chartConfig); 

이것은 모든 샘플의 지속 시간이 같다고 가정합니다.