About the combination of node's style

GoJS
1

Hello everyone, I am trying to use nodeTemplate to construct a specific kind of node with some functions.

Something good to know in advance:

To fulfill what our needs, we used double-tree structure to arrange the nodes.
Our tree could expand both way dynamically (click the button and then expand)

Our goal:

p1
p1905×296 22.7 KB

p2
p21120×356 13.6 KB

Basically, we try to do both the clickable button on left and the PanelExpanderButton on right.

Now:
This is what we had accomplished so far
p3
We found it so hard to combine the ‘Spot’(for the ‘plus button’) and ‘Vertical’(for the PanelExpanderButton / dropdown) style into one node. We used ‘Table’ also to put two kind’s of color in one rectangle node (the second pic). And our node Template become so complicated .

And tips how could we do that? Thanks you so much for your help!

I could add some code up here later if you need it!

Thanks you!

2

What do you want it to look like when it’s expanded? I think you’re probably on the right track. Here’s an example:

3

Thank you for your reply!

However, I do somehow need to change the Diagram.linkTemplate instead of using the default one.
In that case, will this example works? Thanks!

4

Yes, of course you can use this node template with any link template you like when you build your app.

5

Great! I think this work for me. By the way, how can I modify the code in GraphLinksModel to align the info like this image after expanded.
p4

I used new go.Binding(“itemArray”, “info”) and itemTempl before to make the dropdown. How could I do this using the ‘GraphLinksModel’ way? Thanks!

6

Oh I think I found a solution!