All versions of this documentation
X

Integration with WebPack Download code

Ogma has some optional external dependencies to make some of its features work. The two optional dependencies used by Ogma are the xlsx library (to export in the XLSX format) and the dagre library (for the hierarchical layout).

Ogma fetches its optional external dependencies dynamically by looking at the global scope (window) or through require. If you're using WebPack there is a good chance that none of these methods will work for you:

  • WebPack avoids polluting the global (window) scope;
  • Calls to require are replaced at compilation. That's why Ogma does not call require directly: to avoid having to include heavy external libraries that may not be useful to the user

If you wish to use features that require external dependencies, you need to declare them by extending the Ogma.libraries object:

Ogma.libraries[moduleName] = library;

For example, this snippet of code load the dagre library and runs the hierarchical layout on a small graph:

var Ogma = require('/path/to/ogma.min.js');

Ogma.libraries['dagre'] = require('path/to/dagre.min.js');

var ogma = new Ogma();

ogma.generate.random().then(function (graph) {
  return ogma.setGraph(graph);
}).then(function () {
  ogma.view.locateGraph();
  return ogma.layouts.hierarchical();
}).then(function () {
  return ogma.view.locateGraph();
});