問題タブ [multiple-axes]

Y axis2 つの異なる列を測定するために 2つの異なるグループ化された棒グラフを作成しようとしています。データは次のとおりです。

ここに私のコードがあります：

私が抱えている問題は、バーの 2 つのグループが重なっているということです。私にはそれがグループ化されているのを見ることは不可能です。棒の 2 つのグループでどのように表すことができますか?

何か案が？

[編集] - 解決済み:最後の最終チャートを参照してください。

情報

最初にいくつかの背景。非常に単純な折れ線グラフで施設によって生成された電力をプロットする折れ線グラフがあります。この施設には、この電力を生成する 5 つのマシンがあります。場合によっては、これらのマシンに問題やエラーが発生することがあります。

これらのエラーと、マシンごとに、発電チャートとともに、エラーが持続した期間を表示したいと思います。

エラーチャート

Highcharts のドキュメントを読んで、それを示す最良の方法は、columnrangeグラフを反転させて横方向のcolumnrangeグラフにすることであることに気付きました。

以下に例を示します ( jsfidle ):

• Obs:[-6 .. 9 ]軸を軸とdatetime見なす

このチャートは次のように読み取られます: マシン 0 には 2 つのエラーがありました: 1 つは -6 から -1、もう 1 つは 0 から 2 などです。

私は今どこにいますか？

そこで、これを折れ線グラフと一緒に機能させようとしました。そして、これは私がそれを機能させることができない場所です。私のcolumnrangeチャートは水平ではなく垂直のままで、それを反転する方法を理解することができます.

現在の状態は次のとおりです: ( jsfiddle )

質問

これら 2 つのグラフを一緒にプロットする方法はありますか?

[編集] 答え

@jlbriggs コメントのアイデアを使用して、正しいグラフ ( jsfiddle )を思いつくことができました。

次のような csv ファイルが設定されています。

これで、csv ファイルからグラフをプロットする方法がわかりました。以下のスクリプトがあります。

これはうまくいくようです。ただし、rh とは別の y 軸のセットに tmp をプロットできるようにしたいと考えています。複数の軸に複数のプロットをいつプロットするかを知っています。次のことを行う必要があります。

2 つのプロットが得られます。私がやりたいことは、csvファイルの読み取りに基づいて、上記の例でrhのcsv値にs1を設定し、tmpのcsv値にs2を設定することです。どうすればこれを行うことができますか？

plotly.JS でサブプロットを作成しました。下の図に示すように、x 軸は各グラフで共有されます。

下部のグラフのみを表示する代わりに、サブプロットのすべてのグラフの x 軸の値を表示したいと考えています。アンカー属性を使用してこれを達成しましたが、グラフがうまく整列していません。下の図を見てください。ここでは、graph2 の 600 が他の 2 つのグラフに正確に配置されていません。

すべてのグラフで x 軸を共有し、各グラフに x 軸の値を表示したいと考えています。