[English](./README.en-US.md) | 简体中文

G2 5.0

简洁的渐进式可视化语法

[![Build Status](https://github.com/antvis/g2/workflows/build/badge.svg?branch=v5)](https://github.com/antvis//actions) [![Coverage Status](https://img.shields.io/coveralls/github/antvis/g2/v5.svg)](https://coveralls.io/github/antvis/g2?branch=v5) [![npm Version](https://img.shields.io/npm/v/@antv/g2.svg)](https://www.npmjs.com/package/@antv/g2) [![npm Download](https://img.shields.io/npm/dm/@antv/g2.svg)](https://www.npmjs.com/package/@antv/g2) [![npm License](https://img.shields.io/npm/l/@antv/g2.svg)](https://www.npmjs.com/package/@antv/g2) ![examples](https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*FW0gRrLzlMgAAAAAAAAAAAAADmJ7AQ/original)

G2 起源于 Leland Wilkinson 的图形语法：《The Grammar of Graphics》，但又不止于图形语法。 ## ✨ 特色 - **渐进式语法**：结合工业和学术实践，实现图形语法、动画语法和交互语法。 - **丰富的标记**：内置 10+ 基础标记，8+ 高阶标记。 - **高可扩展性**：提供统一机制扩展所有可视化组件。 - **个性化风格**：支持手绘、圆角、纹理等风格。 - **多环境渲染**：支持 Canvas、SVG 以及 WebGL，和 Node.js 服务端渲染。 ## 🔨 开始使用可以通过 NPM 或 Yarn 等包管理器来安装。 ```bash $ npm install @antv/g2@next ``` ```bash $ yarn add @antv/g2@next ``` 成功安装之后，可以通过 import 导入 Chart 对象。 ```html

``` ```js import { Chart } from '@antv/g2'; // 准备数据 const data = [ { genre: 'Sports', sold: 275 }, { genre: 'Strategy', sold: 115 }, { genre: 'Action', sold: 120 }, { genre: 'Shooter', sold: 350 }, { genre: 'Other', sold: 150 }, ]; // 初始化图表实例 const chart = new Chart({ container: 'container', theme: 'classic', }); // 声明可视化 chart .interval() // 创建一个 Interval 标记 .data(data) // 绑定数据 .encode('x', 'genre') // 编码 x 通道 .encode('y', 'sold'); // 编码 y 通道 // 渲染可视化 chart.render(); ``` 如果一切顺利，你可以得到下面的柱状图! example

## 📮 参与贡献 - [问题](https://github.com/antvis/g2/issues)：报告 bug 或者提出需求 - [贡献指南](https://github.com/antvis/g2/blob/v5/CONTRIBUTING.md)：参与建设 G2 - [讨论](https://github.com/antvis/G2/discussions)：在 Github 上或者钉钉群里面讨论（30233731, 35686967, 44788198） code

## 📄 许可证 MIT@[AntV](https://github.com/antvis).