How to a add a ngx-graph custom Layout

Question

All layouts are declared in LayoutService projects/swimlane/ngx-graph/src/lib/graph/layouts/layout.service.ts

I can create a new Layout, but LayoutService#getLayout() cannot discover the new one.

const layouts = {
  dagre: DagreLayout,
  dagreCluster: DagreClusterLayout,
  dagreNodesOnly: DagreNodesOnlyLayout,
  d3ForceDirected: D3ForceDirectedLayout,
  colaForceDirected: ColaForceDirectedLayout
};

@Injectable()
export class LayoutService {
  getLayout(name: string): Layout {
    if (layouts[name]) {
      return new layouts[name]();
    } else {
      throw new Error(`Unknown layout type '${name}'`);
    }
  }
}

I get: throw new Error(Unknown layout type '${name}');

Question was answerd here [link](https://github.com/swimlane/ngx-graph/issues/217) — Marian Venin, Jun 24 '19 at 08:34

score 0 · Answer 1 · answered Jun 26 '19 at 14:59

Posting my answer here as well:

You need to implement a class with the Layout interface, then create an object from that class, and pass that object to the layout input instead of the string.

Here's a component that shows how to do that: https://github.com/swimlane/ngx-graph/blob/master/src/docs/demos/components/ngx-graph-custom-curve/ngx-graph-custom-curve.component.ts#L15

How to a add a ngx-graph custom Layout

1 Answers1