Data Binding Conversion Functions Firing

GoJS
#1

I want my diagram to automatically recognize if it contains two or more nodes sharing the same value on a common property. I have an external model with global node IDs (“gid”), and can have multiple instances of any given node from the model represented as nodes within myDiagram (they are using the standard “key” as their identifier).

My plan was to use data bindings & conversion functions to recognize that myDiagram.findNodesByExample({gid: “example”}) returns an iterator of count > 1. I ran into a behavior I didn’t expect, however, when I realized that I couldn’t console.log anything from inside a data binding conversion function.

Here’s the relevant bits of my code:

new go.Binding("strokeWidth", "bold", function (e) { 
      console.log("BOLD BINDING FIRED"); //purely for testing, this never fires...
      return e ? 3 : 1  // ...even though this is working
    }),
    new go.Binding("strokeDashArray", "bold", function (e) { 
      //I'm worried this will hurt performance, but it's currently my best idea
      const gidNodesInView = myDiagram.findNodesByExample({gid: gidIn}); //get all instances of gid in view
      console.log("Updating bindings: " + gidNodesInView.count()); //this also never fires (and doesn't set the strokeDashArray either, but that's not my immediate question)
      return gidNodesInView.count()>1 ? [10, 5] : [5, 0] 
    })),

This is another in my string of probably very obvious quesitons - but why am I getting no console logs, even though the data binding is properly toggling my strokeWidth?

#2

I just tried it in:

    $(go.Shape,
      { fill: "white" },
      new go.Binding("fill", "color", function(c) { console.log(c); return c; })),

and it worked as expected, with output in the console window. So I cannot explain the behavior that you are (not) seeing.

#3

Not helpful for posterity, but it just started working. I tinkered around with a bunch of stuff in the meantime, so I’m not sure what caused it. My archetypeNodeData didn’t have a “bold” property to begin with - I added that. Perhaps that has something to do with it?

…and I got this message out right after your response. Sorry Walter. :-/

…also for posterity - don’t use parenthesis when calling up “count” on an iterator. It’s iterator.count, not iterator.count();

And while this does (sorta) work now, it only updates the new copy of the node with the dash array. It makes sense that it wouldn’t update the display of the original nodes, nothing about their data model is changing in my current (dumb) approach.

#4

Are you trying to change the appearance of all nodes or all links? Yes, you could update the data property of all of those bound data objects. Or you could (maybe) update a single property on Model.modelData and use a Binding.ofModel binding. https://gojs.net/latest/intro/dataBinding.html#BindingToSharedModelDataSource

#5

So, I’m changing the appearance of all nodes who share a common property I’ve defined called “gid”.

Ultimately, I came to the same conclusion as you - I am just going to leave the data binding function out of it. Instead, I’m calling a separate function that directly updates a new property I"m calling “dash”. Basically, I have a model change listener that looks for newly added or removed nodes, collects the “gid” values of all such nodes in an array, then searches the diagram for all nodes with those values. If the search returns more than one result, I iterate through the results and set the new “dash” property to true. If it’s exactly one result, I set the dash property on that one result to false. It’s working pretty well at the moment. Quite pleased.

The model data example I had overlooked, but I don’t think it’s quite what I would need, given that I’m updating only a subset of all displayed nodes. Thank you for the suggestion, as always.