3

ネットワーク全体の残りのエッジやノードの幅に影響を与えずに、接続されているノードまたは単にエッジであるいくつかのノードを選択するときに、選択したエッジの幅を大きくするように事前定義するにはどうすればよいですか?

ノードまたはエッジが選択されているときに、これを事前定義しました。

$('#cy').cytoscape({
  style: cytoscape.stylesheet()
    .selector(':selected')
      .css({
        'background-color': 'black',
        'line-color': 'red',
        'target-arrow-color': 'black',
        'source-arrow-color': 'black',
        'opacity': 1
      })...

がない'line-width'ので、配置'width': 5すると、すべてのエッジとノードに適用されます。

では、選択したときにエッジ幅を変更して、グラフの残りの部分を同じままにするにはどうすればよいでしょうか?

前もって感謝します！

4

1 に答える 1

4

Cytoscape.js → セレクター

...セレクターは DOM 要素の CSSセレクターと同様に機能しますが、Cytoscape.js のセレクターは代わりにグラフ要素のコレクションで機能します... セレクターを組み合わせて強力なクエリを作成できます... セレクターを結合できます(効果的に論理 OR を作成) コンマ... node、edge、または*(グループ セレクター) グループに基づいて要素を照合します (nodeノード、edgeエッジ、*すべて)...

選択したエッジにのみスタイルを適用するには、選択したエッジのセレクターを使用します。

$('#cy').cytoscape({
  style: cytoscape.stylesheet()
    .selector(':selected')
      .css({
        'background-color': 'black',
        'line-color': 'red',
        'target-arrow-color': 'black',
        'source-arrow-color': 'black'
      })
      .selector('edge:selected')  // ← ← ← ← ←
        .css({
          'width': 5
      })...

jsFiddle デモ: http://jsfiddle.net/xmojmr/rbuj3o9c/2/

于 2015-01-14T10:49:30.000 に答える