-
创建图表
[TOC] 创建图表图表容器图表样式其他配置图表宽度自适应图表动画 创建图表 本节主要讲解如何创建以及配置 Chart 图表对象，主要内容包括图表容器全局样式配置、绘图区、图表宽度自适应等相关内容。 图表容器 <div id="c1"></div> 实例化 Chart 对象时，绑定 dom 容器的方式有两种： 传入 dom 容器的 id ... -
自定义 shape
[TOC] 自定义 Shape1分钟上手自定义 Shape 自定义 Shape 自 G2 2.0.x 版本开始我们添加了自定义 Shape 的机制，以支持部分有 高订制需求的 图表可视化需求。这也是 G2 在向 可编程可视化引擎 迈出的重要一步。 const Shape = G2.Shape;Shape.registerShape(geomName,... -
选择 Canvas 还是 SVG
[TOC] 选择 Canvas 还是 SVG适用场景性能差异定制和交互小结G2 如何使用不同的渲染方案SVG demo 选择 Canvas 还是 SVG HTML5 提供了 Canvas 和 SVG 两种绘图技术，也是多数 Web 图表库使用的渲染技术。Canvas 是基于脚本的，通过 JavaScript 指令来动态绘图。而 SVG 则是使用 XML... -
快速上手
快速上手 安装 通过 npm 安装 浏览器引入 开始使用 1. 创建 div 图表容器 2. 编写图表绘制代码 在 React / Vue / Angular 中使用 G2 快速上手 安装 通过 npm 安装 npm install @antv / g2 -- save 成功安装完成之后，即可使用 import 或 r... -
基础教程
基础教程 基础教程 G2 绘图入门 数据 度量配置 坐标系配置 文本标签配置 图表动画配置 配置图表主题 使用数据调整 图表事件使用 绘制视图 View 绘制分面 为图表配置交互 绘制基础图表 绘制混合图表 使用配置项创建图表 使用滑块 渲染引擎：Canvas or SVG 绘图属性速查 -
数据
数据 数据 支持的数据结构 如何装载数据 如何更新数据 特殊图表的数据说明 区间柱状图 股票图 数据 数据 支持的数据结构 数据是绘制一张图表最基本的部分。G2 支持的数据格式如下： [ { year : 2010 , sales : 40 }, { year : 2011 , sales... -
点图 point
点图 point 点图 point 简介 支持的数据字段格式 数据字段的格式 视觉通道的支持 color size shape 支持的图形 点图跟坐标系 点图和其他图 点图 point 点图 point 简介 几何标记点，一般用于点图。点图是一种表现数据分布的图表，常用于观察数据的相关性，根据点图表示的字段来划分，可以分为下面... -
绘制混合图表
绘制混合图表 绘制混合图表 带均值线的区间面积图 使用 Geometry 组合方式 声明图形语法 外观调整 调整 x 轴的文本的显示格式 同步双 Y 轴数值范围 隐藏一条坐标轴 配置 tooltip 多 View 绘制方式 拆分 View 外观调整 绘制混合图表 绘制混合图表 在 G2 中，混合图表的绘制非常简单，仍然可以通过... -
使用 Canvas 或者 SVG 渲染
使用 Canvas 或者 SVG 渲染 选择哪种渲染器 如何使用渲染器 使用 Canvas 或者 SVG 渲染 使用 Canvas 或者 SVG 渲染 浏览器端图表库大多会选择 SVG 或者 Canvas 进行渲染。对于绘制图表来说，这两种技术往往是可替换的，效果相近。但是在一些场景中，他们的表现和能力又有一定差异。于是，对它们的选择取舍，就成...
