🌈 G6VP Graph Visualization

Just 5 Steps to Present 🎊

1. Start the GeaFlow calculating job and Socket service

Reference Quick Start

⚠️ Note that in the ‘start SocketServer’ step use the following command instead

bin/socket.sh 9003 GI

When the terminal outputs the following, GeaFlow is ready to establish a connection.

If any problem occurs during service startup, see https://github.com/apache/geaflow//issues/1

2. Create a G6VP Project

Enter New Canvas, enter a workbook name. We will manually add the dot edge data later, so choose a case data set here, and use the minimalist template

3. Add Components

We need to add two components, in the toolbar add Clean canvas; Then add Loop Detection Demo to the side container of the default layout

The project canvas should look like this

Click the ‘🧹 Clear’ option in the toolbar to clear the canvas node

By default, a connection is automatically established after the Loop Detection Demo component is added.

GeaFlow will also output the following after the connection is established:

4. Demostration

Loop detection Demo provides two ways to interact:

• Method 1 Enter the dot information in the input box
• Method 2 Demonstrate using built-in data

Both methods essentially call GeaFlow for real-time calculations, but Method 2 omits the manual input process.

Here we use the built-in data for a quick demonstration, click [Options], select ‘Add Points’, 7 points of information appear in the canvas; Then select ‘Add Edges’. We can see the add record in the above dialog.

Similarly, the GeaFlow terminal outputs operational information in real time and automatically starts computation tasks.

5. Result Presentation

After the loop detection calculation task is completed, GeaFlow automatically returns the detection results.

The loop detection results are dynamically displayed on the right canvas: