Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including @savantly/ngx-graphexp with all npm packages installed. Try it out:

require("buffer/package.json"); // buffer is a peer dependency. require("@angular/forms/package.json"); // @angular/forms is a peer dependency. require("zone.js/package.json"); // zone.js is a peer dependency. require("@angular/core/package.json"); // @angular/core is a peer dependency. require("@angular/platform-browser-dynamic/package.json"); // @angular/platform-browser-dynamic is a peer dependency. require("d3/package.json"); // d3 is a peer dependency. require("rxjs/package.json"); // rxjs is a peer dependency. require("@angular/flex-layout/package.json"); // @angular/flex-layout is a peer dependency. require("@angular/material/package.json"); // @angular/material is a peer dependency. require("@angular/http/package.json"); // @angular/http is a peer dependency. require("@angular/common/package.json"); // @angular/common is a peer dependency. require("@angular/platform-browser/package.json"); // @angular/platform-browser is a peer dependency. require("@savantly/gremlin-js/package.json"); // @savantly/gremlin-js is a peer dependency. require("@angular/animations/package.json"); // @angular/animations is a peer dependency. require("@angular/cdk/package.json"); // @angular/cdk is a peer dependency. var ngxGraphexp = require("@savantly/ngx-graphexp")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@savantly/ngx-graphexp v1.0.5

Gremlin client [Tinkerpop] for an Angular app

ngx-graphexp

GraphExp plugin for Angular

Installation

yarn -

yarn add @savantly/ngx-graphexp

npm -

npm install @savantly/ngx-graphexp  

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

graphConfig.ts

Default GremlinClientOptions

gremlin.client.options.ts

Screenshots

example

menu

Select a label and add properties to the node
create node

shift-drag to create a new connection between nodes
drag link

Select the label and add properties to the link
create link

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free