Ng-Neo4jd3

Library for Visualizing Data in form of Graphs with Nodes in Angular using D3

Package Installation Steps:

• using node package manager (npm):

npm install ng-neo4jd3

• using yarn:

yarn add ng-neo4jd3

package link in npm and yarn

Dependency Installation Steps:

D3

• npm: npm install d3
• yarn: yarn add d3

Font Awesome

• npm: npm install font-awesome
• yarn: yarn add font-awesome

Add Style Files:

Supported style types are 'css' and 'scss'. The following code snippet needs to be added with 'angular.json' file.

CSS:

            "styles": [
              ...
              "node_modules/font-awesome/css/font-awesome.css",
              "node_modules/ng-neo4jd3/lib/assets/css/ng-neo4jd3.component.css",
              ...

SCSS:

            "styles": [
              ...
              "node_modules/font-awesome/scss/font-awesome.scss",
              "node_modules/ng-neo4jd3/lib/assets/scss/ng-neo4jd3.component.scss",
              ...

Adding 'twemoji' for node images:

twemoji folder contains several predefined image in the svg format. These images can be displayed on the 'nodes' of the graph to provide a better UI.

• Location for putting twemoji
  • Copy twemoji content from the directory node_modules/ng-neo4jd3/lib/assets/img/twemoji or node_modules/ng-neo4jd3/lib/assets/img/twemoji_test and paste the content within src/assets/img/twemoji directory

Implemenation References

• Test Documentation and Implmenation: ng-neo4jd3-test

• Reference Files:

  • Model: ng-neo4jd3.model.ts
  • Records: ng-neo4jd3.records.ts
  • Icons: ng-neo4jd3.icons.ts

Forked from 'eisman/neo4jd3'

README of the fork 'eisman/neo4jd3'

LICENSE: MIT