Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
Andrei Kashcha
@rishabh-jain thanks :)! No, vivagraph cannot do millions interactively. You can however try using graphviz (sfdp layout) http://www.graphviz.org/ to layout graph offline. With vivagraph (or ngraph modules, to be more accurate) I was able to do offline layout for graphs with 100-300k nodes, and up to 1million edges. You can find example here: http://anvaka.github.io/allnpmviz3d/ (click "about" to see source code). This is not reusable component yet, but I'm working on it.
as for keeping them closer - try playing with the force settings
Andrei Kashcha
this is the offline layouter used by npm visualizatoin: https://github.com/anvaka/ngraph.offline.layout
Thanks anvaka :smile: Will try it out...dont know how much I will be able to..still :smile: cheers!!
BTW..its a beautiful piece of work anvaka...not patronizing you but seriously mate only If I could do it as well..I would like to learn from you.....do reply if you can on write.rishabhjain@gmail.com
Osmar Cavalcante
Hi there! Is there anyone here using vivagraph/ngraph for adding/removing nodes dinamically?
Andrei Kashcha
@osmarpixuri i do this very often :)
Larry Hengl
hi @anvaka, great work, enjoyed the CascadiaJS vid. i'm starting to explore ngraph.pixel (and then pm) with a demo dataset of about 30K edges, currently formatted in a TSV file with columns for Node1, Node2, Stat1, Stat2. I'm thinking the Stat cols would be toggle-able edge weights. Any advice or awareness of libs I can use to load it into ngraph.graph format? Or roll my own loader?
Andrei Kashcha
I think making your own loader should be the easiest way to go...
Hi Anvaka I'm using your graph to visualize ontology in my university study project. But my supervisor wants me to find out what algorithm is used in vivagraphJS can you help me with that. Does it have a name?
Gabriel SoHappy
Has anyone tried making the nodes editable?
Hi Andrei. Some really cool stuff in your repos ! Do any of your libraries do offline 3d layout for graphs ?
Hi Is there an example of building this graph from a json file ? Please do let me know
Leon Pham
Hi, have anyone tried implementing Vivagraph with React.js?
Thanks anvaka for your library realy it's healpful
but I need to run it for some of my customers who hasn't a high specs computer. So I decided to buy a high rendering VGA card and try to run a code on server side insted of client side. can I do that and how?
@anvaka when using ngraph.pixel what is your advice for adding text labels to nodes? Use TextGeometry, or an absolutely positioned element (like the tooltip), or something else?
Andrei Kashcha
@palafranchise I'd go with absolutely positioned elements. They are way easier to customize than text geometries
Andrei Kashcha
@MonkeyChap check this out: https://github.com/anvaka/pm - all graphs have links to offline layouters. If your graph is huge (more than 1 million nodes) I'd go with https://github.com/anvaka/ngraph.native otherwise you can try https://github.com/anvaka/ngraph.offline.layout
Hi @anvaka , I've forked some of your repos for layout to port on cytoscape and try adding some webWorkers for qtree. Nice algo
Andrei Kashcha
@Nickolasmv thank you :)!
Markus Tacker
Hoi, I'm trying to dynamically change layout parameters (e.g. springLength) but it seems that this is not expected. What I want is instead of zooming int the graph just increase the spring length. Any tips?
Hi, @anvaka. I want to add additional parameter to force-layout algorithm - radius of nodes (for avoiding overlaps between nodes). Which part of algorithm will be appropriate for this? What do you think? Now I am using collision detection like post-processing but not sure that this is a good way.
Shikhar Gupta
@anvaka I am trying to add a small graph using ngraph by providing x,y and z co-ordinates, and my plan is to retrieve the co-ordinates back after the relaxation. Unfortunately I am getting back the original co-ordinates. Any tips??
Gilberto Torrezan
Hi guys, newcomer here. Do you have any idea how to avoid nodes from overlapping each other? I'm trying to do a node visualization just like Neo4J does in its query tool. Do I have to use another lib to calculate the positions or is there any property I can set to make that work?
Byron Ruth
Hi everyone. I came across this project as an alternative to Cytoscape that has an SVG-based renderer. My use case for SVG is to inject HTML elements within the SVG nodes using foreignObject (?) My general question is whether anyone has done this successfully before and if so would this be done in the graphics.node(...) callback?
Basically I want to render a workflow diagram as shown here: https://rdm.academy/
The user will need to interactively build this up and I would like to use a graph library to handle layout and basic interactivity.
Gilberto Torrezan
(Today I discovered I'm registered in this Gitter... My question from Sep 13 2016 didn't get any response, and in fact the question from Byron is the only activity in months. This Gitter is abandoned)
Amirhossein Aleyasen
Hi everyone, I am wondering about the performance of VivaGraph in comparison to D3 for drawing large graphs. I'll be thankful if anyone let me know about the concrete performance numbers. Thanks in advance.
Tiago Jesus
Hi everyone, can anyone tell me if you can export vivagraph canvas (with webgl) to a pdf? I know we can right click on the canvas and save as image but that retrieves an image with low resolution that is not very suitable for scientific publications. So, I started wondering if anyone have attempted this and how. Thanks in advance.
Hello ! I might not be at the good place and have a wired idea, but here it is: I try to use ngraph.three in a react/redux environment. I reach to have my graph drawn an updated as I wish. I am currently looking at ngraph.prixel, but there is not the run() method so I don't succeed to draw my graph... is anyone have hints ?
Another not related question... in "ngraph family" is there a way to "weight the edges" ? I mean have different parameters for edges according to a score ?
Robert Nicolas-Emmanuel
@anvaka Hello ! We are using ngraph.pixel for a project, and we want to change the size of the links in the graph. How is it possible ?
RYeah Sh
hi, where can i find the documentation?
Simon Härer
Hi, I'm currently working with ngraph 3d-forcelayout. It is a great library and very convenient to use. Sadly, I want to achieve two things that I couldn't manage myself:
  • From another js forcegraph library I know a parameter that limits the distance nodes influence each other (e.g. if the distance of A and B is greater 100 then there is no repulsion between these node). Does such a parameter exist?
  • Is there a way to restrict movement into a specific direction? E.g. I have a floor and don't want the layout to move node towards this floor.
Hello @smoes . There are some options to set your layout. You can check them here -> https://github.com/anvaka/ngraph.physics.simulator/blob/master/index.js
maybe theta and gravity options can help you if I correctly understand what are trying to achieve
Simon Härer
Thanks for you answer @Zachariadis_gitlab !
Tetha actually sounds like solving point 1, thank you!
Gravity, however, seems not to be a force with a fix direction but describes how node repel each other, right?
Pete Kazmier
Trying to modify the basic demo in ngraph.pixel/demo/basic. In all of the demos, the graphs are programmatically created, but I need to "require('ngraph.graph')" so I can call graph.addNode and graph.addLink. I don't understand the node ecosystem to understand how to build that bundle.js file. But it seems like I need to somehow include 'ngraph.graph' in that file so I can require it from the top portion of bundle.js.
Vincenzo Palazzo
Hello guys I have an question on build oriented graph with Vivagraph, I'm using the WebGL for build an big graph (ALL transaction bitcoin), This is an minimal example https://codepen.io/vincenzopalazzo/pen/LYYNYRB?editors=0010#0. I can add the arrow to the link with the WebGL graph? ps:I know how create the arrow with the SVG
Himaruk Silva
Hi, Im a beginner to the vivagraphJS. I need to know "How we can import external graph file to the graph generator?"
@vincenzopalazzo it is interesting project for me as well - do you want/need any help ?
hey, i'm a little lost. i want to set my own positions for all the nodes before forcedirect begins. which seems like 2 layout algos: my custom one, then forcedirect. how do i set that up?
Vincenzo Palazzo
Hi @gg4u I migrated to ngraph module and built the web app with react, this is the finish app https://vincenzopalazzo.github.io/SpyJSBlock.react/
@vincenzopalazzo nice job! Are you interested in performing analytics on the types of subgraphs you get? Tech questions, do ytou apply a worker to compute layout ?
Vincenzo Palazzo
@gg4u Thanks, What did you mean with "types of subgraphs you get"? and about the "Tech questions" No, I precomputed the layout offline with ngraph.native
by "types of subgraphs you get" I mean the topology of transactions. They may be circular graphs, chains, have peculiar shapes. It is something of use in fraud detection.
Vincenzo Palazzo
@gg4u, mh yes it was true before but if very difficult analizig the bitcoin graph transaction, on this argemt there is a lot of interesting think to talk, but if we using a vere big oversemplification, yes is possible found the fraud.
@vincenzopalazzo yes. i wondered if you were plotting the bitcoin graph on purpose of fraud detection or for research. indeed a very interesting think to talk.