Visualization Vkontakte: Tell me, who is your friend?
Hello, Habralyudi!
I have a hobby. At night ( after hours) I write the graph-laying library: vivagraph.js . I wanted to share with you, find out what you think. I visualized a network of my friends on Vkontakte using WebGL. But it's better to see once than to read, right?
These are my friends. Each point is a person, a whole world, which I was somehow lucky to meet. The line between the dots indicates friendship. True, one can say a lot about a person through this network.
1. Verify that the browser supports WebGL: get.webgl.org - there should be a cube. If there is no cube, try a different browser. Often chrome / foxes block video cards with outdated drivers. Alas, the cube is the key to successful visualization :).
2. Go to www.yasiv.com/vk - this is a visualization of your friends on VK.
3. (optional) - share your card with friends, talk about the site. I will be very happy, because in marketing, alas, no boom boom (who is it?).
WebGL has very strict restrictions on the pictures used in textures. If they come from a different domain, the image server must allow their cross-domain use. It is corrected by adding a response with a picture to the header
Neither CSS, nor SVG, nor even simple canvas 2D can compare with WebGL performance. vivagraph.js supports SVG and CSS, but in both cases, the main rendering brake is the browser code for rendering elements. Only using WebGL does the botnek move to my stacking algorithm :).
Remember the story of six handshakes ? A recent analysis of the full Facebook network has yielded 4.7. For fun, I began to finish building the network from a friend I knew little into the unknown, and such a picture was observed very often:
Your feedback and suggestions are very, very important to me. This is just my hobby, but I really love it. I understand that everything is still damp, and on huge graphs (more than 2000 nodes) everything works too slowly. But instead of trying to do everything right the first time, I would like to ask you, what would you advise to do better? Well, I will be very happy if you join the project and help make it even better :).
I have a hobby. At night ( after hours) I write the graph-laying library: vivagraph.js . I wanted to share with you, find out what you think. I visualized a network of my friends on Vkontakte using WebGL. But it's better to see once than to read, right?
These are my friends. Each point is a person, a whole world, which I was somehow lucky to meet. The line between the dots indicates friendship. True, one can say a lot about a person through this network.
How to build a network of your friends?
1. Verify that the browser supports WebGL: get.webgl.org - there should be a cube. If there is no cube, try a different browser. Often chrome / foxes block video cards with outdated drivers. Alas, the cube is the key to successful visualization :).
2. Go to www.yasiv.com/vk - this is a visualization of your friends on VK.
3. (optional) - share your card with friends, talk about the site. I will be very happy, because in marketing, alas, no boom boom (who is it?).
Why blue squares instead of avatars?
WebGL has very strict restrictions on the pictures used in textures. If they come from a different domain, the image server must allow their cross-domain use. It is corrected by adding a response with a picture to the header
Access-Control-Allow-Origin:*, but alas, VKontakte does not support this yet. If you, a reader, are an employee of VKontakte and have access to the code, please add a header. I will thank you very much, and I will correct the visualization :).Why WebGL?
Neither CSS, nor SVG, nor even simple canvas 2D can compare with WebGL performance. vivagraph.js supports SVG and CSS, but in both cases, the main rendering brake is the browser code for rendering elements. Only using WebGL does the botnek move to my stacking algorithm :).
Small world
Remember the story of six handshakes ? A recent analysis of the full Facebook network has yielded 4.7. For fun, I began to finish building the network from a friend I knew little into the unknown, and such a picture was observed very often:
What do you think?
Your feedback and suggestions are very, very important to me. This is just my hobby, but I really love it. I understand that everything is still damp, and on huge graphs (more than 2000 nodes) everything works too slowly. But instead of trying to do everything right the first time, I would like to ask you, what would you advise to do better? Well, I will be very happy if you join the project and help make it even better :).