Updating node's fill and not redrawing

GoJS
#1

i’m trying to update the node’s fill color and not rebuild the entire tree.
the color will be retrieved from the model data which is changed on a button click (this is rebuilt in the servlet and updated)

i’m not sure how to go about this.

what i’m thinking is something like this but i’m not sure if the right way to go about it:

function changeColor(){
//get the modal data
var str = document.getElementById(“mySaveModel”).value;
var mod = go.Model.fromJson(str);
//iterate through the nodes
var nodes = myDiagram.nodes;
while (nodes.next()){
myDiagram.startTransaction(“updateColor”);
var node = nodes.value;
var keyID = node.data.key;
var data = mod.findNodeDataForKey(keyID);
node.fill = data.color;
myDiagram.commitTransaction(“updateColor”);
}
}

#2

i was able to solve this by using the following:

function changeColor(){
//get the modal data
var str = document.getElementById(“mySavedModel2”).value;
var mod = go.Model.fromJson(str);
//iterate through the nodes
var nodes = myDiagram.nodes;
while (nodes.next()){
myDiagram.startTransaction(“updateColor”);
var node = nodes.value; //current node
var keyID = node.data.key; //get the keyID for the node
var data = mod.findNodeDataForKey(keyID); //get the data for the node
var shape = node.findObject(“SHAPE”); //get the shape for the node
shape.fill = data.color; //set the color for the node
myDiagram.commitTransaction(“updateColor”);
}
}

is this the proper way to do this, or is there a better/faster way?

#3

First, you really don’t want to perform transactions within a loop.

Otherwise this kind of code should work. But it would be a lot easier to use data binding. If there were a binding of the Shape.fill to the color property, you could start a transaction, loop over the nodes and call updateTargetBindings(“color”) on each Node, and finally commit the transaction.

Even easier, but less efficiently, you could call Diagram.updateAllTargetBindings() instead of looping over all of the Diagram.nodes. That depends on whether there are any other Bindings in the nodes.

1 Like