Skip to content
  1. Examples

Count nodes and edges

This example shows how to get the number of nodes and edges in the graph using the getNodes and getEdges methods.

ts
import Ogma from '@linkurious/ogma';

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

// Generate a random graph
ogma.generate
  .random({
    nodes: 7,
    edges: 10
  })
  // Assign the graph to Ogma.
  .then(g => ogma.setGraph(g))
  .then(() => ogma.layouts.force({ locate: true, duration: 0 }))
  .then(() => {
    // Retrieve the number of nodes and edges.
    const nodes = ogma.getNodes();
    const edges = ogma.getEdges();

    // Update the html code.
    document.getElementById('info_nodes')!.textContent = 'Nodes: ' + nodes.size;
    document.getElementById('info_edges')!.textContent = 'Edges: ' + edges.size;
  });
html
<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />

    <link type="text/css" rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <div id="graph-container"></div>
    <div id="info_nodes" class="info n"></div>
    <div id="info_edges" class="info e"></div>
    <script type="module" src="index.ts"></script>
  </body>
</html>
css
#graph-container {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  margin: 0;
  overflow: hidden;
}
.info {
  position: absolute;
  color: #fff;
  background: #141229;
  font-size: 20px;
  font-family: monospace;
  padding: 8px;
}

.info.n {
  top: 5px;
  right: 15px;
}

.info.e {
  top: 45px;
  right: 15px;
}