web-dev-qa-db-ja.com

ハイチャート：y軸0の値がチャートの下部にあることを確認します

ページに一連のハイチャートを出力しています。場合によっては、指定した期間のすべてのデータが0の値で返されることがあります。

このような場合、グラフは次のようになります。 http://jsfiddle.net/charliegriefer/KM2Jx/1/

Y軸のラベルは1つしかなく、0で、グラフの中央にあります。

Y軸の0の値をグラフの一番下に強制します。これは、データを含むページの他のグラフと一致します。

"min：0"、 "minPadding：0"、 "maxPadding：0"、 "startOnTick：true"などのさまざまなyAxisプロパティを試しました。

それはかなり簡単なはずですが、私は途方に暮れています:(

関連するyAxisコード：

yAxis: {
    min: 0, 
    minPadding: 0, 
    startOnTick: true, 
    title: {
        text: ""
    }
},
highcharts
31
charliegriefer

「正しく」表示する唯一の方法は、yAxis max値も指定することでした。 y値を持つデータ要素を指定しない場合、これはHighChartsの問題だと思います。それはそれができると思う最高のチャートを描きます。

13
wergeld

私は別の（そして非常に単純な）解決策を見つけました：

Y軸のminRangeプロパティを設定できます。

yAxis: {
    ...
    minRange : 0.1
}

これにより、すべてのデータが0の場合、HighchartsはyAxisの最小値と最大値をレンダリングします。

更新：

Highcharts 4.1.9フィックスには以下も必要です。

        plotOptions: {
            line: {
                softThreshold: false
            }
        }

更新されたjsフィドル

41
BobTheBuilder

これをHighChartsフォーラムにも投稿しましたが、機能しているように見えます。残念ながら、すべての「0」データ値をチェックするために、グラフをレンダリングする前にデータの前処理を行う必要がありますが、動作します。 HighChartsにもっと「組み込み」の機能があったらいいのに。

したがって、「y」の値を合計した後、0を取得すると、y軸のプロパティは次のようになります。

yAxis: {
    minPadding: 0, 
    maxPadding: 0,         
    min: 0, 
    max:1,
    showLastLabel:false,
    tickInterval:1,
    title: {
            text: ""
    }
}

参照： http://jsfiddle.net/KM2Jx/2/

キーは、 "max"および "showLastLabel"プロパティのようです。

5
charliegriefer

ここで私が思いついた修正は、データの前処理を必要とせず、更新前に使用していたように、ハイチャートにそれを実行させるだけです。 http://jsfiddle.net/QEK3x/

if(chart.yAxis[0].dataMax === 0)
{
   chart.yAxis[0].setExtremes(0, 5);
}

最初の系列軸が0でないかのように、問題が発生しないように、最初の系列軸のみをチェックする必要があります。ハイチャートにプルリクエストを送信する場合がありますが、何らかの理由でこの機能を意図しているように思えます。

3
Ciarán

Highcharts 5.0.1以降、softMaxも使用できます。

softMax：数値
軸のソフト最大値。シリーズデータの最大値がこれより大きい場合、軸はこの最大値のままですが、シリーズデータの最大値が大きい場合、軸はフレックスしてすべてのデータを表示します。

yAxis: {
    min: 0,
    softMax: 100,
    ...
}

以下は、縦棒グラフの例です。 http://jsfiddle.net/84LLsepj/

現在、Highcharts 5.0.7では、すべての種類のグラフで機能しているようには見えません。 this other jsfiddle でわかるように、折れ線グラフでは機能しません。

2
Yorick Hermieu

minRange：1、または分数で表示されると感じるもの
softMax：100またはあなたがそう感じるもの

Result

yAxis: {
         minRange : 1,
         softMax: 100
       }
0
Praveen

Highcharts 5.x.xの場合、指定できるのは次のとおりです。

yAxis: {
  softMin: 0,
  softMax: 1,
};

これは折れ線グラフでは機能しません。上記と同じ構成オブジェクトでminRangeも設定する必要があります。たとえばminRange: 6を定義すると、yAxisに0〜4の範囲が作成されるため、さまざまな値を試してみてください。

0
Maciej Gurban

「min」オプションを追加するだけ

yAxis: {
   min: 0
}
0
benjamingranados