Skip to content
  1. Tutorials

Ogma + TypeScript

Installation

Using template

Check out our template repository.

Details

If you wish to use Ogma within a TypeScript application, we suggest you adding it as a dependency to your project. This can be done in two ways:

Through npm

If you are developing locally and can access the outside Internet you can also install directly.

sh
npm install --save https://get.linkurio.us/api/get/npm/ogma/<VERSION>/?secret=<YOUR_API_KEY>
# or yarn
yarn add https://get.linkurio.us/api/get/npm/ogma/<VERSION>.tgz?secret=<YOUR_API_KEY>

If you cannot use npm from external sources, because of company policy, you can always install it via tar.gz.

Using downloaded tar.gz

The same link used for the npm version can be used to download a tar.gz file: just past it into your browser to download the file. Once downloaded it is possible to tell npm to use it to install locally:

sh
npm install --save path/to/ogma-v.X.X.X.tar.gz

Usage

js
import Ogma from '@linkurious/ogma';

const ogma = new Ogma();
ogma.addNode({ id: 0 });

You can import some other interfaces from the file if you wish to use them in your code, e.g:

ts
import Ogma, { Node, Color } from '@linkurious/ogma';

function getColor(node: Node): Color {
  return node.getAttribute('color');
}

const ogma = new Ogma();
const node = ogma.addNode({ id: 0, attributes: { color: 'blue' } });

console.log(getColor(node));

Data typing

Since Ogma v. 3.0.0 the data field for any item can be typed directly on the Node, Edge, NodeList and EdgeList: in order to leverage such feature it is possible to use typed versions of any API method that returns any <Item> or <ItemList>.

By default the assigned data type is set to any to not have any backward compatibility issue.

For instance:

ts
import Ogma from '@linkurious/ogma';

interface Data {
  company: string;
}

interface EdgeData {
  timestamp: number;
}

const ogma = new Ogma();
const node = ogma.addNode<Data>({
  id: 0,
  attributes: { color: 'blue' },
  data: { company: 'Linkurious' }
});

// ...later on
const currentNode = ogma.getNodes<Data>().get(0); // currentNode is of type Node<Data> here

// It possible to assign also the type of adjacent items to any graph item also
const otherNode = ogma.addNode<Data, EdgeData>({
  id: 0,
  attributes: { color: 'blue' },
  data: { company: 'Linkurious' }
});

// ...later on

// For the "currentNode" version the edges will have the "any" type because a more specific one hasn't been set before
const adjacentEdges = currentNode.getAdjacentEdges(); // adjacentEdges is of type EdgeList here

// On the other hand using "otherNode"
const otherAdjacentEdges = otherNode.getAdjacentEdges(); // otherAdjacentEdges is of type EdgeList<EdgeData> now

The provided Ogma definition file contains already this typings for each method, which are named, as expected NodeDataType and EdgeDataType.

Methods like addGraph will expose both, for instance:

ts
import Ogma from '@linkurious/ogma';

interface NodeData {
  company: string;
}

interface EdgeData {
  timestamp: number;
}

const ogma = new Ogma();
ogma
  .addGraph<NodeData, EdgeData>({
    nodes: [
      {
        id: 0,
        attributes: { color: 'red' },
        data: { company: 'Linkurious' }
      },
      {
        id: 1,
        attributes: { color: 'blue' },
        data: { company: 'Company X' }
      }
    ],
    edges: [
      {
        id: 0,
        source: 0,
        target: 1,
        data: { timestamp: 1580746239841 }
      }
    ]
  })
  .then(
    (graph: {
      nodes: NodeList<NodeData, EdgeData>;
      edges: EdgeList<EdgeData, NodeData>;
    }) => {
      // ...
    }
  );