web-dev-qa-db-ja.com

アイテム間の必須/推奨/オプションの関係を表す

親と子の関係を必須、推奨、またはオプションとしてマークできるツリー構造があります。この構造の深さは3レベルまでです。例えば：

Parent 1
    Child 1-1 (Optional)
        Child 1-1-1 (Mandatory)
            (Course 1
            and
            Course 3)
            or 
            Course 5
        Child 1-1-2 (Recommended)
        Child 1-1-3 (Optional)
    Child 1-2 (Mandatory)
        Child 1-2-1 (Recommended)
        Child 1-2-2 (Recommended)
Parent 2
    Child 2-1 (Recommended)
        Child 2-1-1 (Optional)

ツリーの関係を表示しましたが、次のようにデータをテーブルに表示する必要があります。

Parent 1  Child 1-1  Child 1-1-1  Course 1
Parent 1  Child 1-1  Child 1-1-1  Course 3
Parent 1  Child 1-1  Child 1-1-1  Course 5
Parent 1  Child 1-1  Child 1-1-1
Parent 1  Child 1-1  Child 1-1-2
Parent 1  Child 1-1  Child 1-1-3
Parent 1  Child 1-2  Child 1-2-1
Parent 1  Child 1-2  Child 1-2-2
Parent 2  Child 2-1  Child 2-1-1

ただし、テーブルで関係のタイプ（必須/推奨/オプション）を明確にする方法が必要です。

アイコンが最適な方法であると考えていました。関係の種類が選択されているラジオボタンにアイコンを追加して一貫性を持たせることができるためですが、どの種類のアイコンが最適かわかりません。

私たちはFont Awesomeを幅広く使用しているので、そのプロジェクトの例はどれも素晴らしいでしょう。

また、私がここにいるので、関係がand/orである第4レベルの可能性があります（[このアイテムとこの1つ]または[その1つ]）。また、表に表示する必要があるため、表現や関係の提案も高く評価されます。

iconstableshierarchyrepresentation
4
shimmoril

私たちは皆、私たちのアイデアに参加する必要があると思いますが、私はこれに対して「正しい」答えを与える人を見ることができません。

問題は、アイコンを実際に何を表しているのかをユーザーに知らせなくても、アイコンをこれらの単語に関連付けるのが難しいことです（そのような場合は、最後のオプションを使用します）。

信号機の色を検討することをお勧めします。

  • 赤は必須
  • オレンジ推奨
  • 緑オプションの

アイコンの場合は、次のようなものを選択できます。

  • 感嘆符必須
  • 推奨スター（Amazonのスター評価と同様）
  • オプションの円（「O」の文字と、チェックするかしないかを指定するチェックボックスの両方を再構成します

または、ユーザーが「クリエイティブ」タイプの場合は、「傘を取る」セットを検討します。

  • ボルト必須
  • クラウド推奨
  • Sunはオプション
3
Izhaki

ビジュアルエンコーディングシステムの簡素化と一貫性を保つために、次のセットを使用できます。 options

5
Alexey Kolchenko

テーブル形式では、これを表示するのが難しい場合があります（基礎となる実装によっては）。しかし、子供を指す軽量/灰色の矢印をオーバーレイするアイコンはどうですか？

必須：ロックアイコン推奨：チェックアイコン

何かのようなもの：

Parent 1 --[shrug]-> Child 1-1 --[lock]-> Child 1-1-1
Parent 2 --[check]-> Child 2-1

ただし、ツリービューではなくテーブルでこれを表現することは、ここでは赤旗です。それはツリーです！木を使うと、矢印が下向きになり、親から子供に向かって右向きに曲がります。この種のレイアウトでできることはたくさんあります。

0
Jesse Smith