search

anvaka / ngraph

Beautiful Graphs
MIT License
1.41k stars 131 forks source link

Example of rendering from offline generated layout #30

Open TodAmon opened 7 years ago

TodAmon commented 7 years ago

Very nice you show how to do offline layout for large graphs. Have not been able to find example demonstrating how to use this data and render in browser (ideally using three.js). Thanks.

anvaka commented 7 years ago

Hi Tod. Would something like this work: https://github.com/anvaka/ngraph.pixel/tree/master/demo/offline

?

TodAmon commented 7 years ago

Wonderful, thank you. I had to do a bit of editing to get it to work (I am new with npm so it could be my mistake), namely the index.html from the "offline" folder is trying to pull "bundle.js" from the data folder, when it needs to pull it from the "offline" folder... and the package.json was not browserifying the offline demo... but with those minor changes, I had it working on my screen.

A really nice set of packages you have developed! Was going to be looking into http://anvaka.github.io/allnpmviz3d/? in more detail, but the offline demo I believe will be a much cleaner path forward.

Thank you again.

-Tod

From: Andrei Kashcha notifications@github.com Sent: Saturday, May 20, 2017 2:53 PM To: anvaka/ngraph Cc: Amon, Tod T; Author Subject: [EXTERNAL] Re: [anvaka/ngraph] Example of rendering from offline generated layout (#30)

Hi Tod. Would something like this work: https://github.com/anvaka/ngraph.pixel/tree/master/demo/offline

?

- You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/anvaka/ngraph/issues/30#issuecomment-302898170, or mute the threadhttps://github.com/notifications/unsubscribe-auth/AEZdA1uze46rUV6bA9D0dhp4vHmz_yNXks5r71K9gaJpZM4Ngxw1.

gg4u commented 7 years ago

Hi, me too finding useful this example! A few questions:

1. graph.txt is already generated with IDs in hex numbers (N_0x3cba7e8b98d00): my graph has nodes IDs as strings (like 'Mario' -> 'Ekaterina') do I need to convert nodes' IDs of string type to hex ? what would you suggest?

  1. I need to add properties to links: proximity values: thinkness and colors will be rendered in function of link proximity.

Could you post an example for that?

I read in bundle.js your comments: what do they mean?

// We need to use "dumb" links, otherwise it will be slow // Dumb links cannot be updated directly via properties. Have // to use renderer.edgeView().setFromColor(), renderer.edgeView().setToColor(), etc.

  1. Could you post an example on how to map labels? In labels.json I see an array, can I simply store a dictionary to map strings to hex IDs ? e.g. ['N_0x3cba7e8b98d00' : {'label' : 'Mario', 'nodeType' : 'player'}, ... ]

Thank you!