Select

Left click on a node or edge to select it. Hold "ctrl" to select multiple nodes/edges at the same time. You cannot select both nodes and edges at the same time.
          <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="../build/ogma.min.js"></script>
  <style>
    #graph-container { top: 0; bottom: 0; left: 0; right: 0; position: absolute; margin: 0; overflow: hidden; }
  </style>
</head>
<body>
  <div id="graph-container"></div>

<script>
'use strict';


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

function printSelectionStatus() {
  console.log('nodes : ', ogma.getSelectedNodes().getId().join(','));
  console.log('edges: ',  ogma.getSelectedEdges().getId().join(','));
  console.log('-----');
}

ogma.events.onNodesSelected( function (selection) {
  var nodes = selection.nodes;

  console.log('nodes',nodes.getId().join(), 'added to selection') ;
  printSelectionStatus();
});

ogma.events.onEdgesSelected( function (selection) {
  var edges = selection.edges;

  console.log('edges',edges.getId().join(), 'added to selection');
  printSelectionStatus();
});

ogma.events.onNodesUnselected( function (selection) {
  var nodes = selection.nodes;

  console.log('nodes',nodes.getId().join(), 'removed from selection');
  printSelectionStatus();
});

ogma.events.onEdgesUnselected( function (selection) {
  var edges = selection.edges;

  console.log('edges',edges.getId().join(), 'removed from selection');
  printSelectionStatus();
});

// Generate a random graph and assign it to Ogma.
ogma.generate.random({ nodes: 15, edges: 30 })
  .then(function(g) {
    ogma.setGraph(g);
    ogma.view.locateGraph();
  });

</script>
</body>
</html>