Action buttons inside node

GoJS
1

Hi,
I want to design a flow diagram with below look and feel. Have looked for many samples, but could not find any of them close to what i need. Any guidance would be appreciated. Thanks!

Screen Shot 2018-05-24 at 2.22.29 PM.png772×232 15.5 KB

2

Your Node template should be organized as follows:

Node, "Auto"
    Shape, "RoundedRectangle"
    Panel, "Vertical"
        Panel, "Horizontal"
            Picture, "...path-to-image-source..." // this might have visible set to false
            TextBlock
        Panel, "Horizontal"
            Picture, "...path-to-image-source..."
            Picture, "...path-to-image-source..."
            Picture, "...path-to-image-source..."
            Picture, "...path-to-image-source..."
            Picture, "...path-to-image-source..."

On each Picture you’ll want to set its width and height and its click event handler.

Presumably you’ll implement some kind of form editor in HTML that is filled with the details of the node, from properties that are stored on the Node.data object that is in the model. When the user changes such a property value in HTML you can call Model.set to change the value of the node data property, so that it supports undo/redo.

I hope you have already read Get Started with GoJS and many of the pages of the Introduction, starting at GoJS Introduction -- Northwoods Software.