Secondary

          <title>Secondary text</title>
<script src="../build/ogma.min.js"></script>
<div id="graph-container" style="top: 0; bottom: 0; left: 0; right: 0; position: absolute; margin: 0;"></div>

<script>
  var ogma = new Ogma({
    container: 'graph-container'
  });

  ogma.addNodes([
    {id: 0, attributes: {x: 0, y: 0, text: {content: 'Primary text', secondary: 'Secondary text'}}},
    {id: 1, attributes: {x: 100, y: 0, text: 'Only primary text'}},
    {id: 2, attributes: {x: 50, y: -35, text: {content: 'Both texts can be configured differently', backgroundColor: 'lightgreen', backgroundMargin: 5, size: 13, style: 'bold', secondary: {content: 'Size, style, color, font, background', size: 12, color: 'firebrick', backgroundColor: 'lightblue', style: 'italic', backgroundMargin: 3}}}}
  ]);
  ogma.addEdges([
    {id: 0, source: 0, target: 1, attributes: {text: {content: 'This is an edge primary text,\nit is always displayed above the edge', secondary: 'This is an edge secondary text,\nit is always displayed below the edge'}}},
  ]);

  ogma.view.locateGraph({padding: {bottom: 50}});

</script>