Showing link Labels Conditionally

GoJS
1

I am trying to show link labels if the node and its child nodes are selected, I have the following code:

  myDiagram2.linkTemplate = 
      graph(go.Link, 
 	{ curve: go.Link.Bezier, toShortLength: 5 },
	{layerName: "Background"},
	graph(go.Shape,
	 	new go.Binding("stroke", "isHighlighted", function(h) { return h ? "#388E3C" : "#009BE1"; })
       	 	.ofObject()),
	graph(go.Shape, { toArrow: "Standard" },
	 	new go.Binding("stroke", "isHighlighted", function(h) { return h ? "#388E3C" : "#009BE1"; })
         	.ofObject()),
	graph(go.TextBlock, "",
		{font: "13px sans-serif", stroke: "black"},
                   //key binds to the "key" property in the json
		new go.Binding("text", "isHighlighted", function (h) { return h ? "key" : ""}))
)

In the below screen, shot, I’d like to show label text for all the green links:

Pasted image4165×864 1.68 MB

Thanks

2

You might be wanting to use a Binding on the GraphObject.visible property of the text label, the TextBlock.

3

Can you possibly show this in code? Thanks

4

I’m not entirely sure what you want, but here’s an example that shows a diagram which highlights links when both the fromNode and toNode of that link are in the Diagram’s selection:

Then the links have a data binding with their label text:

        new go.Binding("text", "isHighlighted", function (h, obj) {
          return h ? obj.part.data.from : ""
        }).ofObject()

You wrote a comment in your binding:

 //key binds to the "key" property in the json
new go.Binding("text", "isHighlighted", function (h) { return h ? "key" : ""}))

But that’s not what your code is doing. Your code is returning the string “key” instead of looking at the link data for a data.key. Links also, by default, do not have key properties assigned.

Your binding also needs .ofObject() to work.

5

Awesome, thanks a lot! Works great. I was just wanting to bind to the “weight” property in the links array so when a node was selected it showed the percentages…makes more sense I think when there are links crossing each other the labels sit on top of one another…I just changed to “obj.part.data.weight”. Thanks again

6

Glad that example helped.