5

解決済み:

ありがとう、 tickValues は私に望んでいた結果を与えました。d3.min と d3.max の値を使用しました。

結果

    var xMin = d3.min(groups, function(c) { return d3.min(c.values, function(v) { return v.date; }); });
    var xMax = d3.max(groups, function (c) { return d3.max(c.values, function (v) { return v.date; }); });

    x.domain([xMin,xMax]);

        var xAxis = d3.svg.axis()
            .scale(x)
            .tickFormat(d3.time.format('%y-%m-%d'))
            .orient("bottom")
            .tickValues([xMin, xMax]);

問題：

だから私はD3jsマルチシリーズ折れ線グラフを持っています.

チャート

X 軸は下で、時間です (この範囲はユーザーの選択によって異なり、数日、数週間、数か月、または数年になることもあります)。Y 軸は値で、10 進数です。

私が問題を抱えているのは、軸のラベルが重なっていて、見栄えが悪いことです。

私の質問は、軸の最初の日付と最後の日付のみを表示する方法があるかどうかです。

私はこれに基づいてチャートを作成しました: http://bl.ocks.org/3884955

x軸の私のコード:

    var x = d3.time.scale().range([0, dimensions.width]);

    x.domain([
        d3.min(groups, function (c) { return d3.min(c.values, function (v) { return v.date; }); }),
        d3.max(groups, function (c) { return d3.max(c.values, function (v) { return v.date; }); })
    ]);

        var xAxis = d3.svg.axis()
            .scale(x)
            .tickFormat(d3.time.format('%a %d'))
            .orient("bottom")
            .ticks(5);

        svg.append("g")
            .attr("class", "x axis")
            .attr("transform", "translate(0," + dimensions.height + ")")
            .call(xAxis);
4

1 に答える 1

7

ticks()関数を使用して目盛りの数を調整してみてください。目的の結果が得られない場合は、を使用して目盛りの値を明示的に設定してみてくださいtickValues()。

于 2013-02-05T13:48:39.043 に答える