前提・実現したいこと
Webアプリケーションを作成しているのですが、階層構造のデータを画面に表現する際の適切なデザインがわからず悩んでいます。
以下のようなサンプルデータがDB上に格納されているとします。
| id | parent_id | data |
| ---- | ---- |
| 1| <null> | AAA |
| 2| 1| BBB |
| 3| 2| CCC |
| 4| 3| DDD |
| 5| 1| EEE |
| 6| <null> | FFF |
id=2は1にとっての子データ
id=3は2にとっての子データ…というように無限に階層構造を作成することができます。
id=5もまた1にとっての子であり、1つのデータにとっての子は1つとは限りません。
このようなデータをWebブラウザ上に表現する際のデザインを考えた時、
真っ先に頭に浮かんだのはWindowsのエクスプローラーでした。
無限に続くディレクトリ構造を画面左ペインで表現しています。
しかし、階層が下がると最高位の親に対するインデントが一段ずつ増えていく影響で、深い階層ほどほど見づらくなっていくのが気になってしまいます。
このようなデータを上手に表現しているWebサイト、Webアプリがあれば参考にさせていただきたいので是非教えて欲しいです。
※当然ながらデザインの著作権には十分に配慮した上で参考にさせていただきます。
現在モバイル展開は考えていないので、デスクトップのWebアプリケーションに限定してしまって構いません。
補足情報(FW/ツールのバージョンなど)
フロントサイド
React
Typescript
サーバーサイド
Django(RestFramework)
Python
どうぞ宜しくお願い致します。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。