• Stars
    star
    1,306
  • Rank 34,494 (Top 0.8 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created over 4 years ago
  • Updated 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

🤖 A framework for automated visual analytics.

Switch between English and Chinese English | 简体中文

AVA logo

A framework for automated visual analytics. https://ava.antv.antgroup.com


What is AVA

AVA (AVA examples Visual Analytics) is a technology framework designed for more convenient visual analytics. The first A has multiple meanings: AI driven, Automated, Augmented, and VA stands for Visual Analytics. It can assist users in data processing, extracting insights from data, recommending and generating charts, and optimizing existing charts.

AVA examples

Composition

AVA contains 2 packages, @antv/ava and @antv/ava-react :

  • @antv/ava : AVA core package, containing four main modules:

    • data (Data Processing): Data Processing Module. Used for statistical analysis and processing of datasets.
    • insight (Auto Insight): Automatic Insights Module. Automatically discover data insights from multi-dimensional data.
    • ckb (Chart Knowledge Base): Chart Knowledge Base Module. Based on empirically derived knowledge and observations about the various fundamentals of visualization and charts, it is the cornerstone of intelligent chart recommendations.
    • advisor (Chart Recommendation): Chart Recommendation Module. Recommend chart types and specific chart detail settings based on data and analysis needs, as well as chart optimization for existing charts.
  • @antv/ava-react : A plug-and-play React component library based on the integration of AVA capabilities, it contains three core components:

    • <NarrativeTextVis />: Demonstrate data insight interpretation text. In a full-flow presentation of data analysis, using text to describe data phenomena is as critical as giving insightful conclusions.
    • <InsightCard />: Present data insights in a combination of graphics and text. It is possible to either receive data directly and perform insights automatically, or to visualize and interpret only the insight result data for presentation.
    • <AutoChart />>: Automatically recommends and renders the appropriate chart based on the data. It provides users with the ability to implement intelligent visualizations in one line of code, and the component is currently undergoing further upgrades.

Features

  • Intelligent drive: Integrates automation and intelligence to simplify the visual analysis process.
  • Rich functions: Its functions cover the whole process of data analysis, linking people and data, and connecting the "last mile" of the data analysis chain.
  • Flexible syntax: Rich built-in configuration items and support for customization.

Documentation

Getting Started

NPM package manager can be used to install @antv/ava and @antv/ava-react.

$ npm install @antv/ava
$ npm install @antv/ava-react

The following two examples show the use of @antv/ava and @antv/ava-react respectively (demo code based on React):

  1. Demo 1: Use the insight (Auto Insight) in @antv/ava to extract data insights. Input multi-dimensional data, the backend automatically runs different algorithms to find interesting patterns in the data, evaluates them uniformly and returns high-quality data insights according to the score.

    import { getInsights } from '@antv/ava';
    
    //  Input: Multi-dimensional data
    const data = [
        { year: '2000', value: 100 },
        { year: '2001', value: 200 },
        { year: '2002', value: 220 },
        { year: '2003', value: 230 },
        { year: '2004', value: 245 },
        { year: '2005', value: 156 },
        { year: '2006', value: 178 },
        { year: '2007', value: 180 },
        { year: '2008', value: 190 },
        { year: '2009', value: 1000 },
    ]
    
    // The insightRes contains interesting insights from the data.
    const insightRes = getInsights(data)
  2. Demo 2: Use <InsightCard /> in @antv/ava-react to display the insight results. This component can display data insight results directly, here using the insight results from Demo 1 as input:

    <div id="root"></div>
    // import <InsightCard /> component
    import { InsightCard } from '@antv/ava-react';
    
    const root = ReactDOM.createRoot(document.getElementById('root'));
    
    // render
    root.render(
      <InsightCard insightInfo={insightRes.insights[0]} visualizationOptions={{ lang: 'zh-CN' }} />
    );

    The result of the rendering is as follows:

    Data Insight Results

Contribution PRs Welcome

We welcome all contributions. Please read our Contributing Guide first. You can submit any ideas as pull requests or as GitHub issues. Let's build a better AVA together.

More at Wiki: Development.

Collaboration

iDVx

Papers

VizLinter

Chen, Q., Sun, F., Xu, X., Chen, Z., Wang, J. and Cao, N., 2021. VizLinter: A Linter and Fixer Framework for Data Visualization. IEEE transactions on visualization and computer graphics, 28(1), pp.206-216.

《数据可视化设计的类型学实践》(Exploring the Typology of Visualization Design)

蓝星宇, 王嘉喆. 数据可视化设计的类型学实践, 《美术大观》, 2022(3), 149-152.

License

MIT@AntV.

More Repositories

1

G2

📊 The concise and progressive visualization grammar.
TypeScript
11,919
star
2

G6

♾ A Graph Visualization Framework in JavaScript
TypeScript
10,572
star
3

F2

📱📈An elegant, interactive and flexible charting library for mobile.
JavaScript
7,847
star
4

X6

🚀 JavaScript diagramming library that uses SVG and HTML for rendering.
TypeScript
5,333
star
5

L7

🌎 Large-scale WebGL-powered Geospatial Data Visualization analysis engine
TypeScript
3,403
star
6

G2Plot

🍡 An interactive and responsive charting library.
TypeScript
2,501
star
7

S2

⚡️ A practical visualization library for tabular analysis.
TypeScript
1,382
star
8

wx-f2

F2 的微信小程序
JavaScript
1,267
star
9

G

💥 A flexible rendering engine for visualization.
TypeScript
988
star
10

Graphin

A React toolkit for graph visualization based on G6
TypeScript
973
star
11

G6VP

G6VP is an online visual analysis tool for graphs and a low-code platform for building graph applications.
TypeScript
710
star
12

XFlow

React component for building interactive diagrams.
TypeScript
540
star
13

g6-editor

JavaScript
529
star
14

antvis.github.io

🔜 AntV 新站点!
TypeScript
377
star
15

g2-react

This repo is being deprecated, check Ant Design Charts https://github.com/ant-design/ant-design-charts
JavaScript
361
star
16

gatsby-theme-antv

⚛️ Polished Gatsby theme for documentation site
TypeScript
340
star
17

data-set

state driven all in one data process for data visualization.
TypeScript
240
star
18

hierarchy

Layout algorithms for visualizing hierarchical data.
JavaScript
219
star
19

F2Native

📱📈An elegant, interactive and flexible native charting library for mobile.
C++
210
star
20

layout

Layout algorithms for graphs.
TypeScript
171
star
21

L7VP

L7VP is an geospatial intelligent visual analysis and application development tools.
TypeScript
148
star
22

my-f2

F2 的支付宝小程序版本
JavaScript
144
star
23

g-webgl-compute

A GPGPU implementation based on WebGL.
TypeScript
142
star
24

F6

F6 is a graph visualization engine which provides quick and smooth operations on mobile devices.
JavaScript
127
star
25

f2-canvas

微信小程序 F2 自定义图表组件
JavaScript
118
star
26

algorithm

常用的图算法 JS 实现,提供给 G6 及 Graphin 用于图分析场景使用。
TypeScript
96
star
27

china-geojson

This repo is being deprecated.
96
star
28

SAMJS

TypeScript
81
star
29

L7Plot

🌍 Geospatial Visualization Chart Library
TypeScript
79
star
30

util

utility library for AntV products.
TypeScript
76
star
31

mini-program-f2-demos

支付宝小程序小程序端的 F2 图表 demo
JavaScript
69
star
32

LarkMap

A React toolkit for geospatial visualization based on L7.
TypeScript
61
star
33

scale

📦 Toolkit for mapping abstract data into visual representation.
TypeScript
55
star
34

component

🍱 AntV UI component based on G render engine.
TypeScript
55
star
35

awesome-f2-charts

F2 图表可视化方案精选
HTML
47
star
36

vis-dashboard

🎨 Awesome dashboards, built with G2 and G2Plot.
TypeScript
40
star
37

L7Draw

L7 绘制控件
TypeScript
39
star
38

GUI

UI components for G. Merge to @antvis/component.
TypeScript
39
star
39

coord

Toolkit for apply point transformations for vector.
TypeScript
38
star
40

gatsby-starter-theme-antv

⚛️ Gatsby's starter of 👉
TypeScript
35
star
41

theme-set

💄 Customize theme for G2, G2Plot of AntV(孵化中)
TypeScript
35
star
42

FEngine

TypeScript
30
star
43

Dipper

下一代位置可视分析研发框架
TypeScript
28
star
44

g2-brush

Select a one-, two-dimensional or irregular region using the mouse.
JavaScript
24
star
45

smart-color

A JavaScript library for color computation.
TypeScript
24
star
46

L7Editor

Geographic data editing tool based on L7
TypeScript
24
star
47

L7-react

L7 React 版
TypeScript
23
star
48

g2-plugin-slider

A datazoom slider plugin for G2.
JavaScript
20
star
49

f2-context

F2针对多端的context适配
TypeScript
20
star
50

L7-Leaflet

L7 leaflet 插件
TypeScript
19
star
51

event-emitter

Simple event emitter for @antvis
TypeScript
19
star
52

dumi-theme-antv

AntV website theme based on dumi2.
TypeScript
19
star
53

DipperMap

A tool supporting geo data visualization
TypeScript
16
star
54

L7-boundary

行政区划围栏可视化方案
TypeScript
15
star
55

vis-predict-engine

可视化预测引擎,目前只用于预测图可视化布局.布局预测的模型由本引擎内置,支持force/radial/concentric/circular的四布局分类
TypeScript
13
star
56

attr

Attribute mapping module for @antvis.
TypeScript
12
star
57

graphlib

A lib containing multible usages for graph structure, graph algorithm, and other graph ops.
TypeScript
12
star
58

antv-spec

A declarative grammar that supports various technology stacks of AntV.
TypeScript
12
star
59

geo-coord

地理坐标系
TypeScript
11
star
60

my-f2-pc

淘宝PC小程序
JavaScript
8
star
61

L7Gallery

L7 demo 案例集锦
TypeScript
8
star
62

stat

常用统计函数的实现
TypeScript
8
star
63

interaction

interaction bindings for G2 and F2
TypeScript
7
star
64

L7-CustomLayer-Template

TypeScript
5
star
65

adjust

Adjust module for @antvis.
TypeScript
5
star
66

g-device-api

A Device API references WebGPU implementations
TypeScript
5
star
67

graphin-studio-site

Github Page Repo for Graphin Studio
HTML
5
star
68

A8

A music visualizer
TypeScript
5
star
69

g2plot-schema

Schemas of configs(options) of G2Plot chart types.
TypeScript
4
star
70

template

📃 Template repository for @antvis.
JavaScript
4
star
71

old-site

AntV 旧版本站点
HTML
4
star
72

vis-steg

Visualization Steganography: conceal information within visualization images.
TypeScript
4
star
73

AVAPy

Python Library for Automatic Visual Analytics
Python
4
star
74

g-gesture

WIP: Gesture module for @antv/g.
TypeScript
4
star
75

insight-component

Components for GI&LI
TypeScript
3
star
76

antvis-sites-data

🔢 Headless CMS data for https://antv.vision
3
star
77

g2-next-site

JavaScript
3
star
78

chart-node-g6

the Toolkit for G6 chart type nodes
TypeScript
3
star
79

autochart-config-panel

GUI config panel for the autoChart feature of AntV/AVA.
TypeScript
3
star
80

g-perf

Performance monitor for G.
TypeScript
3
star
81

data-samples

Open data set collection for AntV products
TypeScript
3
star
82

color-schema

A JSON schema used to regulate semantic color assets or palettes.
TypeScript
3
star
83

F7

L7小程序版本,支持支付宝、微信等多端小程序。
TypeScript
2
star
84

g2-3.x-site

The site of G2 3.x version
HTML
2
star
85

async-hook

the control flow for l7
TypeScript
2
star
86

create-antv-demo

A simple CV-dashboard framework for practicing how to use AntV.
JavaScript
2
star
87

g2-extensions

The one-stop shop for official @antv/g2 extensions.
TypeScript
2
star
88

thumbnails

Thumbnail images for different chart types from Chart Knowledge Base.
TypeScript
2
star
89

g6-3.2.x-site

The site for G6 3.2.x
HTML
2
star
90

gi-export

TypeScript
2
star
91

g2plot-1.x-site

The site of G2Plot 1.x version.
HTML
1
star
92

storytelling

Telling story by data visualization.
TypeScript
1
star
93

translator

A translator based on Google Translate.
JavaScript
1
star