DOCSEARCHbyAlgolia
Submit Docs

G6VP Documentation

repository·master·Indexed 21 days ago

https://github.com/antvis/g6vp

G6VP (formerly AntV/GraphInsight) is an online visual analysis platform and low-code tool for graph data. It enables users to connect to graph databases such as Galaxybase, JanusGraph, and Neo4j, configure visual styles and layouts via a canvas, and export applications as SDKs. The platform supports a modular asset system including components, elements, layouts, and services, and provides specialized packages like @antv/gi-assets-advance for advanced visual assets such as ReasonNodes.

Tokens
118.2K
Snippets
417
Records
473
Agent score
75%

What's inside G6VP

  1. Overview of G6VP Basic Assets

    master

    The @antv/gi-assets-basic package provides the foundational building blocks for G6VP development. It is categorized into several asset types that allow developers to construct graph visualizations and workflows:

    • components (组件分析资产): Assets used for component analysis.
    • elements (元素资产): Basic visual or structural elements.
    • layouts (布局资产): Layout algorithms and configurations for graph arrangement.
    • services (引擎资产): Core engine assets and services.
    • templates (模版资产): Pre-defined templates for rapid development.
    • deploys (部署资产): Assets related to deployment and distribution.

  2. Use @antv/gi-assets-neo4j for Neo4j graph analysis

    master
    The @antv/gi-assets-neo4j package provides graph analysis assets specifically designed for Neo4j graph databases within the G6VP ecosystem. It allows developers to integrate Neo4j data sources into G6VP workflows for advanced graph visualization and analysis.

  6. G6VP Data Storage and HTTP API Specification

    master

    G6VP is an open-source product that prioritizes data security by default, storing all site data locally in the user's browser using IndexedDB.

    To support private cloud deployments and data sharing, G6VP provides an HTTP API specification. Developers can implement these interfaces to enable cloud-based data synchronization and sharing.

  7. Understand GI component types

    master

    GI components are categorized into two main groups: GI_CONTAINER and GI_CONTAINER_INDEX.

    GI_CONTAINER (Container Components)

    • GICC: Standard container components.
    • GICC_MENU: Container components for right-click menus.
    • GICC_LAYOUT: Page layout components.

    GI_CONTAINER_INDEX (Atomic Components)

    • GIAC: Standard atomic components.
    • GIAC_CONTENT: Atomic components used for content.
    • GIAC_MENU: Atomic components used for menus.

  8. Create a custom analysis asset

    master

    Custom analysis assets (e.g., a statistician like src/components/Counter) are standard React components that follow a specific export structure to enable collaboration on the G6VP site.

    An asset must export an object containing info (metadata), component (the React implementation), and registerMeta (the props schema using the Formily solution).

    To interact with the canvas context, use the useContext hook from @antv/gi-sdk. This provides access to graph, data, and updateContext (used to update the context).

    import Component from './Component'; // Component implementation
import info from './info'; // Component metadata
import registerMeta from './registerMeta'; // Props Schema using Formily
export default { info, component: Component, registerMeta };
    import { useContext } from '@antv/gi-sdk';
const Counter = props => {
  const { graph, data, updateContext } = useContext(); // updateContext is used to update Context
  return <></>;
};
export default Counter;

  9. Create a custom service asset

    master

    Custom service assets allow you to define or override data services. The exported object must include:

    • id: A unique identifier for the service.
    • type: Set to 'api'.
    • name: Display name.
    • desc: Description.
    • cover: Image URL for the service.
    • component: A React component used in the GI site to manage starting, stopping, and configuring service context parameters.
    • services: An object used to override existing GI asset services. Each service ID is determined by the corresponding asset's info.services.

    Note on Service IDs: In GI, assets are first-class citizens. You can override existing services by using their specific ServiceId. Common ServiceId values include:

    • GI_SERVICE_INTIAL_GRAPH / GI_SERVICE_SCHEMA (for Initializer)
    • GremlinQuery (for GremlinQuery)
    • NeighborsQuery (for NeighborsQuery)
    • PropertiesPanel (for PropertiesPanel)
    • Save (for Save)
    export default {
  id: 'MyServer',
  type: 'api',
  name: '我的服务',
  desc: 'MyServer',
  cover: 'https://gw.alipayobjects.com/mdn/rms_0d75e8/afts/img/A*3YEZS6qSRgAAAAAAAAAAAAAAARQnAQ',
  component: Server,
  services: {
    ...Initializer,
  },
};

  10. Understand GI component and atomic types

    master

    Components in gi-assets-scene are categorized into two main hierarchies:

    GI_CONTAINER (Container Components)

    • GICC: Standard container components.
    • GICC_MENU: Container components for right-click menus.
    • GICC_LAYOUT: Page layout components.

    GI_CONTAINER_INDEX (Atomic Components)

    • GIAC: Standard atomic components.
    • GIAC_CONTENT: Atomic components designed for content.
    • GIAC_MENU: Atomic components designed for menus.

  11. Understand G6VP Component Types

    master

    G6VP components are categorized into two main groups: Containers and Atomic Components.

    GI_CONTAINER (Container Components)

    Used for structural elements of the application.

    • GICC: Standard container component.
    • GICC_MENU: Container component for right-click menus.
    • GICC_LAYOUT: Page layout component.

    GI_CONTAINER_INDEX (Atomic Components)

    Used for individual, granular UI elements.

    • GIAC: Standard atomic component.
    • GIAC_CONTENT: Atomic component designed for content rendering.
    • GIAC_MENU: Atomic component designed for menu items.

  12. Set up and run etcd using Docker

    master

    The service requires etcd. You can set up and run etcd using the Bitnami Docker image.

    1. Pull the image:

    docker pull bitnami/etcd

    2. Run the etcd service: Run the following command to start etcd with no authentication enabled on port 2379:

    docker run --rm -it -e ALLOW_NONE_AUTHENTICATION=yes -p 2379:2379 bitnami/etcd
    docker pull bitnami/etcd

docker run --rm -it -e ALLOW_NONE_AUTHENTICATION=yes -p 2379:2379 bitnami/etcd