How can i set gojs shape and text one after another?

Hi there,

Is there a way to club icon and text and then render this whole text (icon+text) in one column of a row?
Currently Im rending icon in one column and text in another column as I did find any documentation for my scenario.

But this is not giving me the result I want
image

How can I club icon and text in one column ?

Please check my code here (https://codepen.io/manshi44/pen/eYMgJxp?editors=1010)

You have declared your icon as:

        // gojs shape for showing icon
        $(go.Shape, {column: 1, stretch: go.GraphObject.Fill, geometryStretch: go.GraphObject.Uniform, strokeWidth: 0,}, new go.Binding("geometry", "icon", geoFunc)),

You shouldn’t set stretch or geometryStretch. Instead of having the Shape stretch to fill the available area, set its width and height. I see you have set the Panel’s Panel.columnSizing property to None, which is good.

Hi Walter,
Thanks for your response.
But if you see in my code, I have to put icon in one column and textBlock in another column to get them after one another (the way you can see in the result)

I want this Icon and TextBlock both to be shown in one column so that I can get below result
image

So is it possible to put this Icon and Text in one column?

Did you try what I suggested? Each Node is a separate “Table” Panel, so each Node will have its own columns as determined by the width of each of its three elements.

Instead of using a “Table” Panel, just use a “Horizontal” Panel. But you still have to specify the width and height of each icon/Shape and not set stretch.