G6 README

The project's README from github.com/antvis/G6. As one markdown file: README.md.

English | 简体中文

G6: A Graph Visualization Framework in TypeScript

antvis%2FG6 | Trendshift

npm Version Build Status codecov npm Download typescript npm License Ask DeepWiki

Introduction • Examples • Quick Start • API

G6 is a graph visualization engine. It provides basic capabilities for graph visualization and analysis such as drawing, layout, analysis, interaction, animation, themes, and plugins. With G6, users can quickly build their own graph visualization and analysis applications, making relational data simple, transparent, and meaningful.

✨ Features

G6, as a professional graph visualization engine, boasts the following features:

🔨 Getting Started

G6 is usually installed via a package manager such as npm or Yarn.

$ npm install @antv/g6

The Graph object then can be imported from G6.

<div id="container"></div>

import { Graph } from '@antv/g6';

// Get the Data.
const data = {
  nodes: [
    /* your nodes data */
  ],
  edges: [
    /* your edges data */
  ],
};

// Create the Graph instance.
const graph = new Graph({
  container: 'container',
  data,
  node: {
    palette: {
      type: 'group',
      field: 'cluster',
    },
  },
  layout: {
    type: 'force',
  },
  behaviors: ['drag-canvas', 'drag-node'],
});

// Render the Graph.
graph.render();

All goes well, you can get the following lovely graph!

🌍 Ecosystem

For more ecosystem open-source projects, contributions are welcome. Please feel free to submit a PR for inclusion.

📮 Contributing

This project exists thanks to all the people who contribute.

And thank you to all our backers! 🙏

Contribution Leaderboard

📄 License

MIT.

G6 (antvis/G6)

Searching Database…

12.3K ·GitHub
G6
Что это такое?G6 — это фреймворк для визуализации графов в вебе: движок для отрисовки, компоновки, анализа и взаимодействия с данными, где важны связи, — например, с сетями. Есть анимация, темы и плагины.
Это библиотека, которую я подключаю к своему приложению, или готовый инструмент?Это фреймворк, который вы устанавливаете в свой проект на JavaScript или TypeScript и на его основе создаёте приложения с графами, — а не отдельное готовое приложение.
Как добавить его в проект?Установите его через npm или Yarn, затем импортируйте объект Graph из G6 и передайте ему свои данные — граф появится на экране.
G6 бесплатный? Можно использовать его в коммерческих проектах?Да. Это open source под лицензией MIT, поэтому его можно бесплатно использовать, изменять и поставлять в составе коммерческих продуктов.
Что такое Graphin?Простая React-обёртка на основе G6 и SDK для разработки приложений с визуализацией графов. Он входит в экосистему G6 вместе с Ant Design Charts.
Что такое Combo в G6?Combo — это встроенные элементы интерфейса наряду с узлами и рёбрами. Они нужны, чтобы группировать связанные узлы: кластеры можно оформлять и обрабатывать как единое целое.
What are similar projects?G2, sigma.js, cytoscape.js, pixijs, Chart.js, graph, nivo, rete
Which topics is it in?tree, graph-visualization, network, graph, canvas, webgl, svg, visualization, data-visualization, animation, hacktoberfest, rust
Creator
antvis
Size
81.5 MB
Stars
12.3K
Updated
CommitOct 16Release5.1.1Apr 17
Age
9y
Commits · 90 Days