モバイルデバイスでワイドチャートを表示する方法は？
私には大きなチャートがあり、その性質上、かなりの水平方向のスペースが必要です。これは例です： 
モバイルデバイスで表示する方法を見つけるのに苦労しています。横向きモードで読みやすくする方法を見つけることはできましたが、最も問題が多いのは縦向きモードです。
名前のある左側のリストは確かに表示されますが、グラフの主要部分はまだ小さいため、小さな画面に収まりません。
この場合の最善の策は、左側の列を固定し、残りの列をスクロールできるようにすることです。 DataTables Fixed Columns で例（およびそれを行うスクリプト）を見ることができます。
さらに、スクロールする列は日付であるため、グラフィック効果を使用してこれらの日付をスクロールし、静的変数の下に渡します。これにより、視認性が向上し、これがスクロール可能な要素であることをユーザーが理解できるようになります。例を参照してください：
Devinが指摘したように、データはチャートではなくテーブルに表示する方が適しているように感じます。実際のデータはブール値のように見えるので、赤いバー（視覚的な影響の点で少し目立つ）を適切な文字または記号/アイコンに置き換えることができます。これにより、スペースの削減に役立ちます。
無限または無制限の量のデータを設計することは不可能であるため、タイムライン全体を表示するように主張した場合、できることは多くありません。しかし、これが要件ではない場合は、考慮すべきいくつかの代替戦略を提供できます。
- 期間または日付範囲でフィルタリングして表示の幅を制限しますが、表示をスケーリングして処理するという問題があります。
- 一定の時間を表示しますが、モバイルでページ分割を行うのに苦労する価値があるかどうかを確認する必要があります
- ユーザーが期間を拡大または縮小できるようにしますが、インタラクションパターンはモバイルで行うのが難しい場合があります
画面に表示される情報のコンテキストで実際に最も重要だと思うのは、全体像をあまり見るのではなく、個人のパターンや値に変化がある期間を強調することです。したがって、私は実際にモバイルビューを再設計して、次のように表示します。
名前 | [ブール値の最後のYESの日付] [ブール値の最後のNOの日付]
名前 | [ブール値の最後のYESの日付] [ブール値の最後のNOの日付]
名前 | [ブール値の最後のYESの日付] [ブール値の最後のNOの日付]