2

Flotで一貫したバー幅を取得するのに問題があります。1から10のデータポイントを持つことができるチャートがあります。データポイントが10個ある場合、バーは適切なサイズです。ただし、データポイントが10未満の場合、グラフのバーは太くなり始めます。次の2つの画像は、これを示しています。

細い棒

アイテムが10個ある場合、バーは適切なサイズになります。

ファットバー

アイテムが1つしかない場合、バーは非常に大きくなります。

私はそのbarWidth物件を知っていて、それを変えてみました。問題は、10項目のグラフの棒のサイズにのみ影響しますが、太い棒だけでグラフを残すことです。

チャートを含む高さを変更してみることができることもどこかで読んだことがありますがdiv、表示されるアイテムに関係なくチャートの寸法を固定したいので、これは避けたいと思います。

4

2 に答える 2

6

問題は、barWidthが軸単位で表されることです。バーの数を減らすと、y軸は自動的にスケーリングされ、1つのバーだけで0から1になり、デフォルトのバー幅0.8が垂直方向のスペースの大部分を占めます。

これは2つの方法で解決できます。

  1. 系列の数、つまり0.8 * numSeries/maxSeriesに比例するようにbarWidthを計算します。maxSeriesが10の場合、barWidthは10シリーズの0.8から1シリーズの0.08までスケーリングします。

  2. y軸に固定の最小値と最大値を設定します。最大値はnumSeries+(maxSeries-numSeries)/ 2、最小値は-(maxSeries-numSeries)/ 2です。これにより、バーの数がmaxSeriesを下回っても、バーの上下にスペースが確保されます。 。

これらは両方とも、存在するシリーズの最大数についてある程度の知識が必要です。

于 2013-03-26T12:02:13.010 に答える
0

どこかにラベルをyaxis(ticksプロパティ)に渡す必要があると思います。ラベルがmyLabels配列にあると想定します。したがって、ラベルが1つしかない場合は、その前後に新しい空のラ​​ベルを追加して、唯一のバーを小さくします。

var myLabels = [];

// add a fake label (in my production code I grab labels from the server)
myLabels.push([0, 'My only label']); // This label has index=0

if (myLabels.length == 1) {
    myLabels.splice(0, 0, [-1, '']); // (-1) is the new index lower than my label's index
    myLabels.push([1, '']); // (1) is the new index greater than my label's index
}

// In configuration of a plot:

// [...]
yaxis: {
    ticks: myLabels,
    // [...]
},
于 2014-05-07T13:37:56.100 に答える