First, there are three nodes and two links on the drawing.
Then, I add a node (E) and a link(L3) on the drawing.
For the changes in the drawings(new node E and link L3), highlighted or selected all the changes in the drawings.
I hope to be able to do it, can you give me some suggestions or similar examples?
Have you seen this sample? State Chart With Incremental Saves
Let’s assume you want to highlight new nodes and links, rather than selecting them. I’ll start with a copy of that sample.
First, add something to each template so that the user can see some highlighting. For nodes:
$(go.Shape, "RoundedRectangle",
{ . . . },
new go.Binding("stroke", "isHighlighted", function(h) { return h ? "red" : "black"; }).ofObject()),
For links:
$(go.Shape, // the link shape
{ strokeWidth: 1.5 },
new go.Binding("stroke", "isHighlighted", function(h) { return h ? "red" : "black"; }).ofObject()),
Now I’ll add some code in a “ModelChanged” DiagramEvent listener. That sample already has such a listener, so I’ll just add code to that, after the call to showIncremental:
"ModelChanged": function(e) {
if (e.isTransactionFinished) {
// this records each Transaction as a JSON-format string
showIncremental(myDiagram.model.toIncrementalJson(e));
// highlight new nodes and links
myDiagram.clearHighlighteds();
var newcoll = new go.Set(go.Part);
var txn = e.object;
// scan all of the ChangedEvents and find ones that inserted a new node or link into the model
txn.changes.each(function(c) {
if (c.model !== null && c.change === go.ChangedEvent.Insert &&
(c.modelChange === "nodeDataArray" || c.modelChange === "linkDataArray")) {
newcoll.add(myDiagram.findPartForData(c.newValue));
}
});
myDiagram.highlightCollection(newcoll);
}
},