2

d3付きの縦棒グラフを作成しています。263個のデータポイントがあり、すべての列を表示するとグラフが混雑しすぎます。データポイントをフィルタリングするには、n番目ごとのアイテムを取得するだけです（配列の逆から開始するため、最新のデータポイントを確実に取得します）。

フィルタリングされていないデータセットの最小値と最大値を含むように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軸がねじ込まれ、x軸の下に-0.02が表示されます。私は何を間違えましたか？私のフィドル。（y軸が正常に動作することを確認するには、データをフィルター処理する部分をコメントアウトするだけです）

4

1 に答える 1

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

フィルタリングの前にこの部分を移動すれば、問題ないはずです。

于 2013-03-26T21:02:51.440 に答える