GoJS Sample for JSFIDDLE

Impressive software, just way too expensive in my opinion.

by saurabhkolhe

HTML

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

</div>

<! This is tree layout >

JavaScript

init();

function init() {

  // Since 2.2 you can also author concise templates with method chaining instead of GraphObject.make
  // For details, see https://gojs.net/latest/intro/buildingObjects.html
  const $ = go.GraphObject.make; // for conciseness in defining templates

  myDiagram =
    new go.Diagram("myDiagramDiv", // must be the ID or reference to div
      {
        initialAutoScale: go.Diagram.Uniform,
        padding: 10,
        isReadOnly: true,
        layout: $(RadialLayout, {
          maxLayers: 2,
          rotateNode: function(node, angle, sweep, radius) { // method override must be function, not =>
            // rotate the nodes and make sure the text is not upside-down
            node.angle = angle;
            var label = node.findObject("TEXTBLOCK");
            if (label !== null) {
              label.angle = ((angle > 90 && angle < 270 || angle < -90) ? 180 : 0);
            }
          },
          commitLayers: function() { // method override must be function, not =>
            // optional: add circles in the background
            // need to remove any old ones first
            const diagram = this.diagram;
            var gridlayer = diagram.findLayer("Grid");
            var circles = new go.Set( /*go.Part*/ );
            gridlayer.parts.each(circle => {
              if (circle.name === "CIRCLE") circles.add(circle);
            });
            circles.each(circle => diagram.remove(circle));
            // add circles centered at the root
            for (var lay = 1; lay <= this.maxLayers; lay++) {
              var radius = lay * this.layerThickness;
              var circle =
                $(go.Part, {
                    name: "CIRCLE",
                    layerName: "Grid"
                  }, {
                    locationSpot: go.Spot.Center,
                    location: this.root.location
                  },
                  $(go.Shape, "Circle", {
                    width: radius * 2,
                   ...