Questions tagged [cytoscape.js]

Cytoscape.js is a JavaScript graph theory / network library for analysis and visualisation (Compatible with CommonJS/Node.js/Browserify/Webpack, AMD/Require.js, jQuery, npm, Bower, jspm, Meteor/Atmosphere, and plain JS/JavaScript)

Cytoscape.js is, according to its website, a JavaScript graph library for analysis and visualisation (compatible with Node.js, jQuery 1.4+, and plain JavaScript).

Cytoscape.js allows you to easily display graphs in your websites and contains a slew of useful functions in graph theory. You can use Cytoscape.js headlessly on Node.js to do graph analysis in the terminal or on a web server.


Related tags :

Asking a question:

  • Reduce your issue to a small example
  • Explain the behavior you experienced and its difference from your expectations
  • Post a reduced working code on codepen.io, plnkr.co or jsfiddle.net

Getting started :

Community:

Advantages:

  • A fully featured graph library written in pure JS
  • Highly optimised
  • Documentation includes live code examples, doubling as an interactive requirements specification
  • Fully serialisable and deserialisable via JSON
  • Uses layouts for automatically or manually positioning nodes
  • For more information please click here
1285 questions
0
votes
1 answer

How to manipulate cytoscape.js graph data before rendering

I have relatively big amount of graph data (over 1000 nodes, over 2000 edges). Cytoscape.js is failing to render this amount of data, so I decided I will cook some interactive graph exploration. I want to start with graph roots (it is DAG) and user…
Nebril
  • 3,153
  • 1
  • 33
  • 50
0
votes
1 answer

Reseting panzoom should set the graph in original state in cytoscape.js

As given https://github.com/cytoscape/cytoscape.js-panzoom when I drag any node to any position and again zoom it and reset(i.e.fit to screen) that zoom using reset button,the draged node remains at new position where it is droped,it only fits…
smita chougale
  • 235
  • 5
  • 19
0
votes
1 answer

Cytoscape.js - not adding all "ele" at startup

Situation: I have a graph with 500 nodes (say 1000 edges), with a root. Goal: I want the user able to progress in the graph, by cliking on nodes, showing the edges and new nodes around. Way I do for now: I first load all elements in memory (the…
parisni
  • 920
  • 7
  • 20
0
votes
1 answer

Cytoscape Edgehandles: multiple cy instances messing with Ghost Edgehandles

I want to display several instances of cytoscape in a single page, in a time sequence: first one set of nodes are displayed on the graph, the user must create edges between them, then he moves to a second graph, etc. There seems to be a conflict…
umbolt
  • 23
  • 6
0
votes
1 answer

Cytoscape Edgehandles: graph display problems

I've been working through the cytoscape edgehandles demo and I experienced several problems while manipulating it. First of all, it looks like the canvas context is not x=0, y=0 in the cy viewport, as the position of a node situated at the top left…
umbolt
  • 23
  • 6
0
votes
1 answer

How to make orthogonal edges with cytoscape.js

I have a basic example working with cytoscape.js, which looks like this: Notice how all the edges start and end from the center of the nodes. I'd like to make orthogonal edges which start from the center-right point of the source node and end at…
T Nguyen
  • 3,309
  • 2
  • 31
  • 48
0
votes
1 answer

How to make a continuous animation with citoscape.js

How to make a continuous animation with citoscape.js to simulate a small random motion on all nodes. Something that look as if they had a small gravity. I try to make nodes move around a starting point only slightly.
Martin
  • 1,282
  • 1
  • 15
  • 43
0
votes
1 answer

Cytoscape.js, graph is not displayed with correct settings

Good day for all. I apologize in advance for any errors in the letter. After D3.js i had started learning new for me library - cytoscape.js. Simple examples is working, but then I try to use in my angular.js-project the cytoscape.js - I had some…
Sun's Man
  • 76
  • 1
  • 7
0
votes
1 answer

Edits to Cytoscape canvas not being saved to .png

I have been using cytoscape on a project for some time, but want to do some custom edits to the visualization which the API doesn't support. I can do these with the native canvas methods. However, once I update the canvas, the changes are not…
ragingsquirrel3
  • 415
  • 3
  • 12
0
votes
1 answer

Does cytoscape.js have a way of producing JSON to be sent to server for saving?

There is a note on the cytoscape.js website that says: "Note that a collection is immutible by default, meaning that the set of elements within a collection can not be changed. The API returns a new collection with different elements when necessary,…
Volksman
  • 1,969
  • 23
  • 18
0
votes
1 answer

applying specific css to added edges in cytoscape edgehandles

I want to add specific CSS (for instance a specific line-color) to certain, but all, edges added with cytoscape.js-edgehandles.js. I used to cy.edges(selector) command to apply a specific line-color (red) to the edges with source ('I'). But this…
umbolt
  • 23
  • 6
0
votes
1 answer

What support for XGMML or other stable formats is in Cytoscape.js?

I see that Cytoscape.js has many of the great features of Cytoscape Web. But I don't see XGMML support in Cytoscape.js. Is that correct? Is XGMML graph support on the roadmap or is there some simple way to convert XGMML files into a format that…
Bayesian
  • 66
  • 2
0
votes
0 answers

Finding the best cytoscape.js layout for my needs

I am trying to visually graph the relationship between components, where there components have a many to many relationship between each other. If anyone is familiar with the database diagram tool in SQL server management studio or Linq to…
Jeremy
  • 44,950
  • 68
  • 206
  • 332
0
votes
2 answers

CytoscapeJS network graph - Edges are not plotted

I am facing a new issue with using CytoscapeJS. I have a network graph with 300+ nodes and 300+ edges in a JSON object (can rise to 500+ nodes & 1000+ edges in some cases). The nodes are getting plotted using coLa layout but only the 1st 50 edges…
Ajit Singh
  • 115
  • 11
0
votes
1 answer

Displaying content on top of an edge in Cytoscape.js

In my graph, each node would represent a state and the edges are allowed transitions between those states. I also allow there to be actions that are performed when there is a transition from one state to another, so the actions are attached to the…
Andrew Serff
  • 2,117
  • 4
  • 21
  • 32