56 Star 144 Fork 47

antv / G2

Create your Gitee Account
Explore and code with more than 8 million developers,Free private repositories !:)
Sign up
Clone or Download
Cancel
Notice: Creating folder will generate an empty file .keep, because not support in Git
Loading...
README.md

English | 简体中文

G2 5.0

G2 是一个可视化语法,用于报表搭建、数据探索和可视化叙事。

Build Status Coverage Status npm Version npm Download npm License

examples

G2 5.0 仍在开发中,4.x 稳定版在 master 分支上.

G2 的名字来自于 Wilkinson 的《Grammar of Graphics》,并在功能和 API 设计上深受它的启发。这里有一些资源可以帮助你开始使用它:

  • 介绍:概述和开发动机
  • 案例:大量可供学习和复制粘贴的案例
  • 教程:交互式案例驱动的教程,帮助你了解核心概念
  • API:所有可视化组件的完整文档

✨ 特色

  • 渐进式使用:可以通过简明的声明,快速获得有意义的可视化图表,G2 会在内部会做出合理的推断。但是针对复杂和高级的场景,仍然可以添加更多的配置去满足你的需求。
  • 声明式 API:我们采用了函数式的声明式 API,可以通过更具编程风格的方式指定图表配置,这有助于更好地重用逻辑和更灵活地组织代码。
  • 高可扩展性:为了满足各种特定需求,G2 提供了一个方便和一致的机制来扩展你能想象到的一切,无论是一个比例尺,一个变换还是一个视觉元素,等等。你甚至可以基于这个机制定制一个全新的可视化工具。
  • 全面的语法:和传统可视化工具不同,G2 中没有图表的概念,而是通过组合视觉元素、变换、比例尺、坐标系变换和视图复合来获得图表。除了静态可视化之外,还支持制作由数据驱动的可视化动画,并且提供了一套精心设计的基于 Action 的交互语法。
  • 强大的渲染引擎:在 G2 底层有一个强大的渲染器 G,可用使用 Canvas、SVG 以及 WebGL 生成基于网页的可视化。同时 G 提供了大量的插件,使得 G2 能够绘制拥有新颖风格的图表(比如手绘风格)并且可以并完全拥抱 D3 的生态。

🔨 开始使用

可以通过 npm 或 Yarn 等包管理器来安装。

$ npm install @antv/g2
$ yarn add @antv/g2

成功安装之后,可以通过 import 导入 Chart 对象。

<div id="chart"></div>
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 },
];

// 实例化图表并且指定容器的 id
const chart = new Chart({
  container: 'chart',
});

// 声明可视化
chart
  .interval() // 创建一个 Interval 的视觉元素,并且添加到图表中
  .data(data) // 给这个视觉元素绑定数据
  .encode('x', 'genre') // 将 genre 对应的列数据和 x 位置通道绑定
  .encode('y', 'sold'); // 将 sold 对应的列数据和 y 位置通道绑定

// 将可视化渲染进指定的容器
chart.render();

如果一切顺利,你可以得到下面的柱状图!

📮 参与贡献

  • 问题: 报告 bug 或者提出需求
  • 贡献指南:参与建设 G2
  • 讨论:在 Github 上或者钉钉群里面讨论(30233731, 35686967, 44788198)

📄 许可证

MIT@AntV.

About

G2 是一套基于可视化编码的图形语法,以数据驱动,具有高度的易用性和扩展性,用户无需关注各种繁琐的实现细节,一条语句即可构建出各种各样的可交互的统计图表。 expand collapse
JavaScript and 3 more languages
MIT
Cancel

Releases

No release

G2

Contributors

All

Activities

Load More
can not load any more
JavaScript
1
https://git.oschina.net/antv/g2.git
git@git.oschina.net:antv/g2.git
antv
g2
G2
v5

Search