AntV G2

A concise, progressive visualization grammar for building custom charts.

← Back to All Libraries

Overview

AntV G2 is a powerful grammar-of-graphics charting library from Ant Group for custom interactive visualizations.

G2 treats charts as compositions of data, marks, encodings, and scales. That makes it flexible for unusual chart forms while still covering common business visuals well.

Why Choose AntV G2?

  • Flexible grammar-based chart construction
  • Strong interaction and animation support
  • Battle-tested in large-scale Ant Group products
  • Works well for both standard and highly custom charts

Real-World Applications

Used widely in BI dashboards, admin consoles, analytics platforms, and design systems that need consistent, highly customizable charts.

Example Charts

Live AntV G2 demos — column, line, and pie.

Column Chart

Line Chart

Pie Chart

Example Code

Minimal getting-started snippet for AntV G2.

// npm install @antv/g2
import { Chart } from "@antv/g2";

const chart = new Chart({
  container: "chart",
  width: 420,
  height: 240,
});

chart
  .interval()
  .data([
    { label: "A", value: 28 },
    { label: "B", value: 55 },
    { label: "C", value: 43 },
    { label: "D", value: 72 },
  ])
  .encode("x", "label")
  .encode("y", "value")
  .encode("color", () => "#e8b84a");

chart.render();