JointJS内の特定のセルのみを選択します

Question

セルの属性を変更したい場合クリックします。たとえば、セルをクリックするとその属性を変更する必要があります。

このコードは完全に動作しています...しかし、別のセルをクリックすると、赤い塗りつぶしはそれにのみ適用され、残っているすべてのセルの赤い塗りつぶしは以前と同じようにデフォルト値に戻ります。

var graph = new joint.dia.Graph; （彼らは前にあったように）私は別のノード上でクリックしたときにデフォルトに残っているセルのすべての属性をリセットするためにいくつかのことを探して

var paper = new joint.dia.Paper({ 
    el: $('#myholder'), 
    width: 600, 
    height: 200, 
    model: graph, 
    gridSize: 1 
}); 
var rect = new joint.shapes.basic.Rect({ 
     position: { x: 100, y: 100 }, 
     size: { width: 100, height: 30 }, 
     attrs: { rect: { fill: 'blue' }, text: { text: 'my box', fill: 'white' } } 
    }); 

var rect2 = new joint.shapes.basic.Rect({ 
    position: { x: 20, y: 30 }, 
    size: { width: 150, height: 30 }, 
    attrs: { rect: { fill: 'white' }, text: { text: 'my box2', fill: 'blue' } } 
}); 

rect2.translate(300,30); 

var link = new joint.dia.Link({ 
    source: { id: rect.id }, 
    target: { id: rect2.id } 
}); 

graph.addCells([rect, rect2, link]); 

paper.on('cell:pointerdown', function (cellView) { 

       cellView.model.attr({rect: { fill: 'red' }}); 

       }); 

// ...すべてのノードの現在、変化する色の赤へのIクリック。

Answer 1

1. レッド

   paper.on('cell:pointerdown', function (cellView) { 
       _.each(graph.getElements(), function(element) { 
        element.attr({ 
           rect: { fill: 'white' } 
        }); 
        }); 
       cellView.model.attr({rect: { fill: 'red' }});  
   

   }の元の色にグラフ

2. 変更

3. 変更cellviewを）からすべての要素を取得します。

覚えておいてください_etherループのためにアンダースコアを使用しました。