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

Using eles.breadthFirstSearch() to perform operations on nodes it traverses

Can eles.breadthFirstSearch() be used to perform operations on the nodes it traverses over? From the documentation: eles.breadthFirstSearch( [function(i, depth)] [, directed] ) function(i, depth) A handler function that is called when a node is…
JD.
  • 2,361
  • 6
  • 25
  • 38
0
votes
1 answer

Generating tooltips with cytoscape.js?

I'm trying to replicate the helpful tooltip feature of the old cytoscape web. Is there a way to attach a tooltip to nodes and edges in the new cytoscape.js? I've tried looking for this function, but couldn't find anything. Thanks!
JD.
  • 2,361
  • 6
  • 25
  • 38
0
votes
1 answer

Selecting elements against a dynamic set of values in cytoscape.js

It's possible to execute cy.elements('edge[direction = "'+ direction +'"]') to dynamically select according to the value of a variable, but is it possible to have cytoscape recognize collections of values? I'm looking for something like: var…
JD.
  • 2,361
  • 6
  • 25
  • 38
0
votes
1 answer

Node and edge outline?

In cytoscape.js halo outlines can be set for text. Can this effect also be applied to nodes and edges? I've tried experimenting with the keyword, but it didn't work.
JD.
  • 2,361
  • 6
  • 25
  • 38
0
votes
2 answers

How to create custom style mapping in cytoscape.js?

Is there a way to add a custom mapper to the new cytoscape.js? I know there is data(nodeKey), but that uses nodeKey's value de novo. Can I set a mapping of my own? Thanks!
JD.
  • 2,361
  • 6
  • 25
  • 38
0
votes
1 answer

Displaying large networks with cytoscape.js

I'm trying to use cytoscape.js to display large networks with hundreds of nodes. However, cytoscape.js seems to always want to constrain everything to the viewport, which can be problematic if there are too many nodes crowding up the viewport. I'm…
georged
  • 1
  • 2
0
votes
1 answer

Example on matching direct children of the parent node in cytoscape.js

I am trying to match direct children of a parent node in cytoscape.js. I want to make the child nodes of a parent node visible on clicking on it. There is simple selector to do this as per the Cytoscape JS docs- Selector-Compound Nodes This is what…
Pranjal Mittal
  • 10,772
  • 18
  • 74
  • 99
0
votes
1 answer

How to disable multi-select behavior on touch-devices in cytoscape.js?

For cytoscape.js 2.0.[0-1], on touch-devices, by default, as you click on nodes/edges, every one of them gets "selected" -- causing multiple-selections as user taps on different elements within the network. Is there an option to prevent this…
Arman
  • 19
  • 3
0
votes
1 answer

the correct way to register core extensions to cytoscape.js

The main repository already contains examples for extensions of layout/renderer, but I was not able to find a best-practice example for how to extend the core. Looking at the core components themselves, the following convention seems to work; but…
Arman
  • 19
  • 3
0
votes
1 answer

What is the best way to bind e.g. a jquery menu to a cytoscape.js node?

In cytoscapeweb it was possible to configure a context-menu for e.g. nodes (addContextMenuItem). How can I achieve the same with cytoscape.js? I would like to bind a menu for each node. It seems that I have a problem to select the node and then…
Christian
  • 5
  • 1
  • 1
0
votes
1 answer

How to use a descreteMapper like on cytoscapeweb?

My nodes contain an attribute "classid". For every classid I would like to use a specific background-image. How can I map data to a node-attribute, like it was possible on cytoscapeweb by using the descretemapper…
Christian
  • 5
  • 1
  • 1
0
votes
1 answer

How to draw pie chart in Cytoscape(or any JavaScript) tree

I have use Cytoscape javascript to draw a Tree. The problem is I want to display many of value in a node, so we decide to draw the pie chart instead of it's original circle to represent many value. But I don't know how to draw pie chart over a…
0
votes
1 answer

How to export graph in different formats in cytoscape.js?

As a follow-up to this post: https://groups.google.com/forum/?fromgroups#!topic/cytoscape-discuss/GV2vr4d4EQI I was wondering if there is any documentation/example on how we can use cytoscape.js' export functionality?
Arman
  • 19
  • 3
-1
votes
2 answers

Make the curvy edge into a straight edge in cytoscape.js

I created a graph using Cytoscape.js and cytoscape-expand-collapse, but one edge has a curvy shep as shown in image 01. I want it as a straight arrow as shown in image 02. I tried changing the Edge line property to achieve that, but not worked. Can…
Sanka Sanjeewa
  • 1,993
  • 14
  • 16
-1
votes
1 answer

How to vertically align dagre parent nodes in cytoscape.js

I have a graph made in cytoscape.js, using the dagre extension, that looks like this: Graph How can I get the parent nodes to line up vertically? Since applying a separate layout to only parent nodes does not work (it applies to all nodes), I am…