TEXTBLOCK GOJS

by saurabhkolhe

HTML

<script src="https://gojs.net/latest/release/go.js"></script>
<div id="sample">
  <div id="myDiagramDiv" style="border: solid 1px black; width:100%; height:650px"></div>

</div>

<! This is layered layout >

JavaScript

init();

function init() {
  const $ = go.GraphObject.make;
  myDiagram =
    $(
      go.Diagram, "myDiagramDiv", // must be the ID or reference to div
      {

        "undoManager.isEnabled": true // enable undo & redo
      });

   var assyTempl = $(go.Node, "Auto", {
      layoutConditions: go.Part.LayoutStandard
    },
    $( go.Panel, "Auto",
    	$(go.Shape, "Rectangle", {
      	name: "SHAPE",
      	fill: "yellow"
   	 	})
    ),
    // new go.Binding("fill", "color")),
    $(go.TextBlock, {
        textAlign: "center",
        isMultiline: true,
        //maxLines: 3,
        //width: new go.Binding("width", "width").makeTwoWay(),
        width: 80,
        //wrap: go.TextBlock.None,
        //overflow: go.TextBlock.OverflowEllipsis
      },
      new go.Binding("text", "name"))
  );


  var partTempl = $(go.Node, "Auto", {
      layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized
    },
    $(go.Shape, "Rectangle", {
      name: "SHAPE",
      height: 40,
      fill: "red"
    }),
    // new go.Binding("fill", "color")),
    $(go.TextBlock, {
        minSize: new go.Size(50, 16),
        textAlign: "center"
      },
      new go.Binding("text", "name"))
  );

  myDiagram.layout = $(go.LayeredDigraphLayout, {
    columnSpacing: 10,
    direction: 0,
    layerSpacing: 50
  });
  // create the nodeTemplateMap, holding three node templates:
  const templmap = new go.Map(); // In TypeScript you could write: new go.Map<string, go.Node>();
  // for each of the node categories, specify which template to use
  templmap.add("assy", assyTempl);
  templmap.add("part", partTempl);

  myDiagram.nodeTemplateMap = templmap



  // define the Link template
  myDiagram.linkTemplate =
    $(go.Link, go.Link.Orthogonal, {
        layerName: "Background",
        corner: 5
      },
      $(go.Shape, {
        name: "LINK",
        strokeWidth: 1.5,
        stroke: "black"
      }), $(go.Shape, // the "from" arrowhead
        new go.Binding("fromArrow", "",...