フィルターオプション

full モードでは、ヘッダーに グラフ フィルター パネル (漏斗アイコン、または Shift+K) フォームが自動的に構築されます。デフォルトでは、ライブラリはその形式を派生します ノードデータをスキャンすることによって。 UI.filter を使用してそれを引き継ぎます。

const options = {
    UI: {
        filter: {
            facets: [ /* … */ ],   // declare the facets — the form follows
            excludeKeys: ['uuid'], // or just prune the derived ones
        },
    },
}

UI.filter.enabled: false はパネルとその錠剤を削除し、Shift+K をすべて削除します。 graph.queryEngine は引き続きコードからフィルターします。

フォーム それ自体が適用されます: ピックまたはティックは作成した瞬間にコミットされます。テキストまたは 入力をやめてから 1 ビート後にパターンフィールドが表示されます。適用ボタンがないため、パネルは キャンバスにないフィルターを表示しないでください。 リセット、セクションラベルの横、 すべての属性フィルターを一度にクリアします。

ノードではなくエッジをフィルタリングする

このページのすべては nodes を選択します。 edges をフィルタするには — リレーション全体を非表示にします グラフを移動せずに kind — 代わりに UI.filter.edgeFacets を宣言します。彼らは再利用します 同じファセット語彙であり、エッジレイヤー に文書化されています。

自動導出 (デフォルト)

UI.filter がまったくない場合、パネルはすべてのノードのデータ キーを調べ、 キーごとに個別の値を取得し、見つかったものからウィジェットを選択します。

値はどのようになるか	ウィジェット
すべての数字	numberRange (最小/最大)
3つ以上の短い文字列	multiselect
1～2本の短い文字列	select
ブール値	select (真/偽)
他に何か	text

ラベルはキーから整形されます (attr-type → Attr Type)。これはいいですね 探索データのゼロ構成デフォルトですが、どのキーを知る方法がありません ファセット でどれが内部です — uuid は 1 つのオプションを含むドロップダウンになります ノードごとに、長いフリーテキストフィールドはテキストボックスに劣化します。

excludeKeys

導出時の安価な修正はほぼ正しいです。ノイズとなるキーを削除します。

UI: { filter: { excludeKeys: ['uuid', 'imageUrl', 'description'] } }

宣言されたファセット

facets を設定すると、代わりにフォームが宣言から生成されます。 ラベルを付けて、リストした順序でフィールドをリストします。自動導出は 完全にスキップされるため、データが変更されても何も変化しません。

UI: {
    filter: {
        facets: [
            { key: 'category', label: 'Category', type: 'multiselect',
              options: (graph) => distinct(graph, 'category') },
            { key: 'to_ids',   label: 'IDS flag', type: 'boolean' },
            { key: 'value',    label: 'Value',    type: 'regex' },
        ],
    },
}

ファセットの key は queryEngine.setFilter(key, …) が使用するキーでもあるため、 プログラムによるフィルタリングとパネルは同じ立場にあります。

ファセットの種類

• text — matchMode に従って、部分文字列または完全一致。
• regex — 大文字と小文字を区別せず コンパイルされたパターン。コンパイルできないパターン フィールド上で報告され、アクティブなフィルタはそのまま残ります。
• select / multiselect — options から選択します。配列、または 関数はライブ グラフに対して解決されるため、オプション リストはデータに従う ファセットセット自体は変更されません。
• numberRange — 最小/最大のペア。
• boolean — true / false / 未設定のドロップダウン。

ラベル

宣言された label は 逐語的 として使用されるため、翻訳から来たものである可能性があります 層。これを省略すると、キーは自動導出と同様に整形されます。

計算されたファセット: accessor

デフォルトでは、ファセットは node.getData()[key] となります。 accessor はあなたが何を読んでも読みます たとえば、ノード上にまったく存在しないものも含みます。

// "this object contains an attribute of type X" — reads the node's children
{ key: 'child_type', label: 'Contains attribute of type', type: 'multiselect',
  options: () => ATTRIBUTE_TYPES,
  accessor: (node) => node.children.map((child) => child.getData()['attr-type']) }

配列を返すことは問題ありません。以下の 配列の一致 を参照してください。

フルコントロール: predicate

A predicate が自らメンバーシップを決定し、accessor / matchMode に勝ちます。 フィルター アプリケーションごとにノードごとに実行されるため、コストを抑えます。

{ key: 'busy', label: 'Busy services', type: 'text',
  predicate: (node, value) => node.getData().load >= Number(value) }

accessor または predicate がスローされるファセットはマッチングを停止します (一度警告します)。 レンダリングを一緒にダウンさせるのではなく。

注文

フィールドは宣言の順序に従います。ファセットを明示的に配置するには、ファセットに order を設定します — ファセットを複数の場所から組み立てる場合に便利です。

マッチング

matchMode はフィルター値の比較方法を決定します。

• 'exact' デフォルト — 厳密な平等。のために multiselect (選択の配列) これはメンバーシップです: any-of。
• 'partial' — 部分文字列一致、String(nodeValue).includes(value)。
• 'all' — and-semantics: 選択されたすべての値が存在する必要があります。

一致する配列

ノードの値が array — data.tags = ['tlp:amber', 'malware'] — a の場合 フィルタは平等ではなくメンバーシップをテストします:

// matches nodes tagged 'malware'; does NOT match a node tagged 'not-malware'
graph.queryEngine.setFilter('tags', { value: 'malware' })

// any-of: amber OR green
graph.queryEngine.setFilter('tags', { value: ['tlp:amber', 'tlp:green'] })

// all: amber AND green
graph.queryEngine.setFilter('tags', { value: ['tlp:amber', 'tlp:green'], matchMode: 'all' })

'partial' では、任意の単一要素が部分文字列一致する可能性があります。 numberRange 反対 配列は、いずれかの要素が範囲内にある場合に一致します。

行動の変化

これがサポートされる前は、配列ノード値は次のようになります。 String(nodeValue).includes(value) — つまり、malware を誤ってフィルターしてしまいました not-malware のタグが付いたノードと一致しましたが、配列フィルター値は一致しませんでした 全部。どちらも上記のように動作するようになりました。

否定

negate: true は、フィルターで非表示になる内容を保持します。パネルの各フィールドには、 is / is not は、それを設定するラベル行をオンにします。 * に切り替えられたフィールドは* ではなく描画されます 赤、ピックが突き刺さった。

// every type but domain, including types added later
graph.queryEngine.setFilter('type', { value: ['domain'], negate: true })

// nothing tagged malware
graph.queryEngine.setFilter('tags', { value: ['malware'], negate: true })

ウィジェットごとに逆の解釈になります。リストはどれも、テキストフィールドです。 * には* が含まれていません ('partial' あり)、パターン * は* と一致しません、* の範囲は* の外です。と 'all'それは**のすべてではありません。 predicate ファセットの答えは反転されます。

キーの 値なし を持つノードは、ドメインでもないため保持されます。それでフィルター そしてその否定は常にグラフを 2 つに分割し、各ノードはちょうど片側にあります。値 何も絞り込まないもの (空のリスト、空の文字列、開いた範囲、使用できないパターン) まだ何も絞りません。

True / False フィールドにはスイッチがありません: は true ではありません は * false* です。エッジフィルター (setEdgeFilter) negate も取ってください。ファセットを共有する 凡例 セクション キーをクリックすると、否定されたフィルターが否定されたままになります。

接続されていないノードを非表示にする

リレーションをフィルタリングして除去すると、ノードが取り残されます。スイッチを切り替える エッジレイヤー がオフになり、唯一のリレーションが含まれていたノードはエッジレイヤーに残ります。 何も取り付けられていないキャンバス - レイヤーはレンズであるため、これは意図的なものです。あなたが do はこれらのノードを削除してほしい、これがノード側のルールです。

const options = {
    UI: {
        filter: { hideDisconnected: true },
    },
}

レイヤーとノードのフィルターを適用した後に、表示中のエッジが残っていないノードは非表示になります。自己ループは関係として数えますが、ノードに固定されたメモは数えません。

同じスイッチが View フライアウトに 未接続を隠す として、すべてのグラフでオフにあります。 オプションがオンになっていない限り、ユーザーはレイヤーを左に切り替えることで孤児をクリーンアップできます。 あるいは隠したものを元に戻します。隠れている間、行にはその数が表示されます。

これはグラフを動かします

このページの他のすべてとすべてのエッジ レイヤーは、レイアウトをそのまま残します。隠された ノードがシミュレーションから離れるため、残りは再設定されます。それはきちんとしたキャンバスと引き換えです。 それが、ルールがデフォルトでオフになっている理由です。

意図的に行わないことが 2 つあります。

• クラスターの内部はそのままです。 クラスターは関係のないノードを定期的にグループ化します。 それらの間にルールを適用すると、空のボックスが開きます。
• 何も保護されていません。 すべてのレイヤーをオフにすると、何も接続されていないため、何もありません 描かれています。スイッチは帰り道です。

graph.queryEngine.setHideDisconnected(true)  // same as the switch
graph.queryEngine.isHideDisconnected()
graph.queryEngine.getDisconnectedNodeCount() // what the switch row reports

データ変更後の再申請

フィルターは、グラフのデータが変更されたときではなく、フィルターが変更されたときに適用されます。エッジを追加する ノードが欠落しており、何かが再計算されるまで非表示のままです。

graph.updateData(newNodes, newEdges)
graph.queryEngine.reapply()   // recompute now

呼び出す前に知っておく価値があります: 可視性を再取得すると、マニュアルが元に戻ります ** graph.hideNode()**、それは何も覚えていません。 queryEngine.excludeNode() は皮です 生き残るもの — それはコンテキスト メニューと一括アクションで使用されるものであり、Show だけが使用されます。 ノード はそれを反転します。

パネルが値を取得する場所

フィルター values は、フォームがどのような方法であっても常に graph.queryEngine を通過します 構築済み - ヘッダーのアクティブフィルター数、隠れノード リスト、および 展開されたクラスターのサブグラフへの伝播はすべて機能し続けます。宣言されたファセット クラスターのサブグラフにも渡されるため、accessor / predicate ファセット 最上位ノードをフィルタリングするのと同じように、子をフィルタリングします。

キャンバス legend は、同じエンジンへの 3 番目の方法です。 凡例行はそのカテゴリを非表示にします。レジェンドに宣言済みの key を与えます select / multiselect ファセットと 2 つのドライブ 1 フィルターにより、パネルの コントロールと凡例は連動します。

データテーブル は 4 つ目です。その グラフに適用 ボタン 列フィルタが除外した要素を非表示にします。このプッシュは、次の予約キーの下に着陸します。 独自のものであるため、このパネルのフォームが適用されるものすべてに存続し、何と組み合わせられます このパネルは交換ではなくフィルタリングを行っています。構造的に形が表現できないため、 予約キーを使用すると、パネルは、プッシュによって隠されている内容を示すテーブルから行が成長します — そして、ドックが折りたたまれたら、そこから片付けることができる唯一の場所です。

フィルタ/クエリエンジンを参照してください。 実際の例のギャラリー カード、および FilterFacet フルタイプ。