How to add a text/label inside a shape?
@walter , I have modified the “myRowHeaders ” from the sample : Basic Day/Hour Infinite Timeline to the following:
Now, i wanted to have some texts inside the 2 shapes: “Square” and “Rectangle”.
myRowHeaders =
$(go.Diagram, "myRowHeadersDiv",
{
nodeTemplate:
$(go.Node, "Auto",
...
$(go.Panel, "Horizontal",
{ alignment: go.Spot.Left},
$(go.Shape, "Square",
{
...
click: function (e, shape) {
...
}
}
),
$(go.Panel, "Vertical",
...
$(go.TextBlock,
...
),
$(go.Shape, "Rectangle",
{
click: function (e, shape) {
...
}
},
)
)
)
)
});
How this can be achieved?
Thanks.
walter
January 16, 2018, 1:08pm
2
A Vertical Panel will not position either element within the other.
I really do not know what you want. Could you provide some screenshots or sketches?
I am targeting to create the following diagram:
Till now, i am able to create this diagram, but not able to add text as shown in next diagram:
Shapes in red circle need to have some text inside them, like this:
"+" in “Square” shape "Show" in “Rectangle” shape
walter
January 16, 2018, 2:26pm
4
One normally implements such borders or containers around an object by using an “Auto” Panel. GoJS Panels -- Northwoods Software
Using this way, i.e, by adding “textblock ”, “Shape ” is not “clickable ” on the “text area ”
walter
January 16, 2018, 4:16pm
6
I’m thinking you want it to be something like:
Node, "Auto",
Shape,
Panel, "Vertical",
TextBlock, "Activity-Task-13",
Panel, "Auto",
Shape,
TextBlock, "show"
Yeah, but, Using this way, text is below the shape.
walter
January 16, 2018, 4:39pm
8
??? Try it the way I suggest.
Yes, Text is inside the Shape…
But, Using this way, i.e, by adding “textblock ”, “Shape ” is not “clickable ” on the “text area ” inside the shape …
walter
January 16, 2018, 5:01pm
10
Again I’m not sure what you want, but I am guessing that you will want to move the GraphObject.click event handler from the Shape to the enclosing “Auto” Panel.
That is basically how “Button” is defined: https://gojs.net/latest/extensions/Buttons.js
Yes, i want to do something like that…
“Button” works for me…
