Search code examples
htmlangulartypescriptgraphdiagram

How to start with ngx-graph for Angular 7


I am trying to use ngx-graph for Angular 7 to create a network diagram. But since the documentation is not very good and the demo is too much for a beginner I would appreciate any help of how to begin with ngx-graph. Maybe with a small example with 2 nodes and 1 link between them.

I hope somebody can help me.

Thank you :)


Solution

  • There is a documentation for it: https://github.com/swimlane/ngx-graph

    First, install the package with D3 dependency:

    npm install @swimlane/ngx-graph --save
    npm install d3 --save
    

    And import NgxGraphModule to your module (app.module.ts).

    After, you can use <ngx-graph></ngx-graph> component in your components (HTML), and data in the component logic. The documentation explains, and has an example how to set data and required properties.

    Demo

    Demo-Code