Node and TextBlock size increasing issue

GoJS
1

hi team,
i am facing some issue regarding the maximization of TextBlock and while entering 50 to 100 length of words the TextBlock size get increases and node size also get increases can you please provide me an example so that i can enter n number of alphabet into textblock of node and its size doesn’t get increase.

Right now i am using this code block

myDiagram.nodeTemplate =
$(go.Node, “Spot”,
{ locationSpot: go.Spot.Center },
new go.Binding(“location”, “loc”, go.Point.parse).makeTwoWay(go.Point.stringify),
//{ selectable: true, selectionAdornmentTemplate: nodeSelectionAdornmentTemplate },
{ resizable: true, resizeObjectName: “PANEL”, resizeAdornmentTemplate: nodeResizeAdornmentTemplate },
//{ rotatable: false, rotateAdornmentTemplate: nodeRotateAdornmentTemplate },
new go.Binding(“angle”).makeTwoWay(),
// the main object is a Panel that surrounds a TextBlock with a Shape
$(go.Panel, “Auto”,
{ name: “PANEL” },
new go.Binding(“desiredSize”, “size”, go.Size.parse).makeTwoWay(go.Size.stringify),
$(go.Shape, “Rectangle”, // default figure
{
portId: “”, // the default port: if no spot on link data, use closest side
fromLinkable: true, toLinkable: true, cursor: “pointer”,
fromLinkableDuplicates: true, toLinkableDuplicates: true,
toMaxLinks: 8,
fill: fill, stroke: stroke,
strokeWidth: 2,
minSize: new go.Size(30, 30)
},
new go.Binding(“figure”, “figure”).makeTwoWay(),
new go.Binding(“fill”, “fill”).makeTwoWay(),
new go.Binding(“stroke”, “stroke”).makeTwoWay()),
$(go.TextBlock,
{
font: “bold 11pt Helvetica, Arial, sans-serif”,
stroke: lightText,
margin: 8,
textAlign: “center”,
minSize: new go.Size(20, 20),
wrap: go.TextBlock.WrapFit,
editable: true,
isMultiline: false, // don’t allow embedded newlines
textValidation: validateText
},
new go.Binding(“text”, “text”).makeTwoWay()),
{
toolTip: // define a tooltip for each node that displays the color as text
$(go.Adornment, “Auto”,
$(go.Shape, { fill: “#444” }),
$(go.TextBlock, { margin: 4 },
new go.Binding(“text”, “”, diagramNodeInfo))
)
}
),
{ contextMenu: $(go.Adornment) },
// four small named ports, one on each side:
makePort(“T”, go.Spot.Top, true, true),
makePort(“L”, go.Spot.Left, true, true),
makePort(“R”, go.Spot.Right, true, true),
makePort(“B”, go.Spot.Bottom, true, true),
{ // handle mouse enter/leave events to show/hide the ports
mouseEnter: function (e, node) { showSmallPorts(node, true); },
mouseLeave: function (e, node) { showSmallPorts(node, false); },
mouseDrop: dropOntoNode
}
);

2

The easy thing to do is to set TextBlock.maxSize so as to limit the width. Perhaps something like:

        $(go.TextBlock,
            {
              maxSize: new go.Size(150, NaN),
              . . . })

But if you really want to limit the number of characters rather than the width, you could customize the <textarea> used by the default text editor. Something like this:

    var ed = myDiagram.toolManager.textEditingTool.defaultTextEditor;
    if (ed instanceof go.HTMLInfo && ed.mainElement instanceof HTMLTextAreaElement) {
      ed.mainElement.maxLength = 12;
    }