How to Deploy G6VP with GraphScope for Powerful Graph Visualization and Analysis

What is G6VP

G6VP is an open‑source graph visualization and analysis platform from AntV. It lets users import data from local files or various graph databases, assemble rich visual and analytical assets, and embed custom graph‑analysis products into their own systems.

Deploying G6VP and GraphScope

G6VP uses GraphScope as its backend engine. Because G6VP does not provide an online server, integration requires Docker images. Currently G6VP supports the combined deployment of GraphScope’s persistent graph store (Groot) and interactive query engine (GIE). Future support for the analytical engine (GAE) is planned.

Docker Image Deployment

First pull and run the GraphScope store image, ensuring the ports are mapped so the query service is reachable.

docker pull registry.cn-hongkong.aliyuncs.com/graphscope/graphscope-store:httpserver
# Start the container, map ports for Gremlin and HTTP services
# 12312: Gremlin query port
# 9527: HTTP service port
docker run -d -p 12312:12312 -p 9527:9527 registry.cn-hongkong.aliyuncs.com/graphscope/graphscope-store:httpserver

After the persistent storage container starts, it loads a default dataset. To import a custom dataset, refer to the Groot documentation. Verify the container is running with:

// Replace localhost with the server IP if needed
curl http://localhost:9527/api/v1/graph

The GraphScope engine will be accessible at http://localhost:9527, which will be needed later when connecting G6VP.

Starting the G6VP Proxy Service

There are two ways to start the G6VP HTTP service:

Use the binary installation package:

Download gi-httpservices.tgz from the G6VP repository, extract it, and ensure NodeJS is installed.

Run the service:

cd gi-httpservice
# make sure port 7001 is available
lsof -i:7001
npm run start

Build from source:

Clone the G6VP repository, navigate to G6VP/packages/gi-httpservice, install dependencies, and start the service.

git clone https://github.com/antvis/G6VP.git
cd G6VP/packages/gi-httpservice
npm install
npm run dev

When the HTTP service is running, open http://localhost:7001 (default port 7001) to see the G6VP console.

Connecting G6VP to GraphScope

Enter the platform address (the G6VP HTTP service URL, e.g., http://localhost:7001) and the engine address (the GraphScope service URL, e.g., http://localhost:9527) in the connection dialog and click “Start Connection”. After a successful connection, a “Select Subgraph” panel appears.

Choose a subgraph from the dropdown, give the dataset a name (e.g., crew_graph), and click “Enter Analysis”. The new dataset appears in the dataset list.

Creating a Workbook and Analyzing Data

Open the newly created dataset, click the computer icon to create a workbook, name it, and click “Create Canvas”. The canvas and configuration panel will be displayed.

In the workbook, configure a Gremlin query asset. For example, entering g.V().limit(10) returns the first ten vertices.

You can adjust node and edge styles in the “Style” panel, perform one‑hop neighbor expansion via the right‑click menu, or customize the expansion asset in the left panel.

Filters with intelligent recommendations are also available for statistical analysis.

Exporting and Further Resources

Save the workbook; it is stored locally and not uploaded. To embed the workbook in your own system, click “Open” and choose one of three export methods.

For more usage details and documentation, visit the official G6VP docs or raise issues on the G6VP GitHub repository.

Conclusion

By jointly deploying G6VP and GraphScope, users can easily manage and create graph data, then leverage GraphScope’s powerful computation capabilities for various graph analytics tasks. Future integration of additional GraphScope engines is expected.