My GSoC journey till mid-term evaluation

Hey there! I am Pushpendra and I am working on the GraphNet project for the Scorelab organization. Graphnet is a javascript graph library that is created as a module to the semantic UI framework. Graphnet dynamically renders all nodes and edges via web socket connections, and node and edge positioning algorithms such as force, random, circular, etc. It can be used for integrating data visualization in any javascript-based application.

Getting Started — Initial Weeks

I started my work by simply rendering the nodes and edges and tweaking around their position and changing their properties like color, stroke, radius, etc. While I was experimenting with different types of implementations and things that I can do with the graph I talked to my mentor about the deliverables and discussed the folder structure of the project.

Moving forward

After completing the basic structure of the project I moved forward by adding more properties in nodes and edges, making it more appealing.

Next steps

After completing the basic structure of nodes and edges I moved further and worked on the physique of the graph. So I added functionality where we can drag the graph from one position to another and also change the position of the nodes in real-time.

Starting with Algorithm

Till now, I was working on the basic stuff of the graph like the properties of nodes, the physique of the graph, positions of nodes, etc. And now was the time for the most challenging and interesting part of the project i.e. designing the algorithm for optimal positioning of the graph. To tackle this challenge I used a forced positioning algorithm as guided by my mentor.

Forced-positioning algorithm :- Forced positioning algorithm is an algorithm in which we use physical forces to determine the position of the nodes in the graph. We can assume it as a system where all the nodes are steel balls and the edges are springs. Initially, the steel balls are placed randomly at any position in the space and then when we release them, they will change their position such that the energy in the system becomes minimum. And at that position, the steel balls will be at optimal positions.

However, I didn’t use the exact formula for the positioning of nodes. I have to change the formula according. First of all, I need to introduce a repulsive force that can act between every node, so that to repel a node from every other node. The second thing I need to introduce is some constants in the formula for it to work accordingly.

Before applying the force positioning algorithm:-

After applying the force positioning algorithm:-

Conclusion and next steps

Till now I have learned a lot about how the positioning of nodes in graph work. My positioning algorithm is also ready. Now I will connect it with a real-time data stream so that we can visualize data in real-time using web socket connections.