ngx-graphexp
GraphExp plugin for Angular
Inspired by GraphExp
Installation
yarn -
yarn add @savantly/ngx-graphexp
npm -
npm install @savantly/ngx-graphexp
Demo app
Usage
Import the required modules into your application
import { GraphexpModule, GraphexpService } from '@savantly/ngx-graphexp';
import { GremlinClientOptions } from '@savantly/gremlin-js';
Create an instance of the GraphexpService, passing in a configuration object -
export const graphexpService = new GraphexpService(new GremlinClientOptions());
Use the component in your application, passing in custom options -
import { GraphConfig, GraphexpService } from '@savantly/ngx-graphexp';
import { Component } from '@angular/core';
@Component({
selector: 'sv-root',
template: '<sv-graphexp [graphexpService]="service" [graphConfig]="graphConfig"></sv-graphexp>',
styleUrls: ['./app.component.css']
})
export class AppComponent {
graphConfig: GraphConfig = new GraphConfig();
constructor (public service: GraphexpService) {
this.graphConfig.nodeLabels = ['god', 'titan', 'demigod', 'human', 'monster', 'location'];
this.graphConfig.linkLabels = ['is_father_of', 'has_pet', 'lives_in'];
}
}
Default GraphConfig options
Default GremlinClientOptions
Screenshots
Select a label and add properties to the node
shift-drag to create a new connection between nodes
Select the label and add properties to the link
Build/Development
To build the library - use yarn or npm
yarn build:lib
To build the example app -
yarn build
Files are output to ./dist
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent