mullr/cytoscape.js-bubblesets

Cytoscape.js Bubblesets plugin

Cytoscape.js BubbleSets Plugin

A Cytoscape.js plugin for rendering Bubblesets.

Install

npm install cytoscape cytoscape-layers cytoscape-bubblesets

Usage

see Samples on Github

or at this

import cytoscape from 'cytoscape';
import BubbleSets from 'cytoscape-bubblesets';
cytoscape.use(BubbleSets);

const cy = cytoscape({
  container: document.getElementById('app'),
  elements: [
    { data: { id: 'a' } },
    { data: { id: 'b' } },
    {
      data: {
        id: 'ab',
        source: 'a',
        target: 'b',
      },
    },
  ],
});
cy.ready(() => {
  const bb = cy.bubbleSets();
  bb.addPath(cy.nodes(), cy.edges(), null);
});

Alternative without registration

import cytoscape from 'cytoscape';
import { BubbleSetsPlugin } from 'cytoscape-bubblesets';

const cy = cytoscape({
  container: document.getElementById('app'),
  elements: [
    { data: { id: 'a' } },
    { data: { id: 'b' } },
    {
      data: {
        id: 'ab',
        source: 'a',
        target: 'b',
      },
    },
  ],
});
cy.ready(() => {
  const bb = new BubbleSetsPlugin(cy);
  bb.addPath(cy.nodes(), cy.edges(), null);
});

API

• addPath(nodes: NodeCollection, edges?: EdgeCollection | null, avoidNodes?: NodeCollection | null, options?: IBubbleSetPathOptions): BubbleSetPath

  creates a new BubbleSetPath instance. The nodes is a node collection that should be linked. edges an edge collection to include edges. avoidNodes is an optional node collection of nodes that should be avoided when generating the outline and any virtual edge between the nodes.

• removePath(path: BubbleSetPath)

  removes a path again

• getPaths(): readonly BubbleSetPath[]

  returns the list of active paths

Development Environment

npm i -g yarn
yarn set version latest
cat .yarnrc_patch.yml >> .yarnrc.yml
yarn
yarn pnpify --sdk vscode

Common commands

yarn compile
yarn test
yarn lint
yarn fix
yarn build
yarn docs
yarn release
yarn release:pre