antv-g2学习手册-上

G2所构建出的图表是由一系列独立的图形元素组合而成的:

1. 数据Data：可视化最基础的部分
2. 图形属性Attribute：负责将数据中的变量映射到图形空间
3. 几何标记Geometry：即在图表中实际看到的图形元素，如点，线，多边形等，每个几何标记对象含有多个图形属性，G2的核心就是建立数据中的一系列变量到图形属性的映射
4. 度量Scale：数据空间到图形属性空间的转换桥梁，每一个图形属性都对应着一个或者多个度量
5. 坐标系Coordinate：描述了数据是如何映射到图形所在的平面的，同一个几何标记在不同坐标系下会有不同的表现。
6. 可视化组件Component：图标辅助元素，用于增强图标的可读性和可理解性
7. 分面Facet：描述如何将数据分解为各个子集，以及如何对这些子集作图并联合进行展示，主要用于多维数据分析

View视图

View是拥有独立数据源，并且能够绘制多个图形的容器，里面会包含Geometry，组件，交互，事件等，而Chart是继承于View。

数据

G2支持的数据格式如下：

[
	{key:value},
	{key:value},
]

数据重载
当chart实例创建完毕之后，通过chart.data(data)装载数据

数据更新
G2更新数据的方式有两种

1. 图表数据更新（前后数据结构不发生变化），更新后马上刷新图表

	chart.changeData(data)

2. 仅需要更新数据，但不需要马上更新图表

	chart.data(newData);//更新
	chart.render();//更新图表

注：更新数据时还可以清除图表上的所有元素，重新定义图形语法，改变图表类型和各种配置

	chart().line().position(x*y);
	chart.render();
	chart.clear();//清理所有图形
	chart.data(newData);//加载新数据
	chart.interval().position(x*y).color("z");//重新定义图形语法
	chart.render();

图表组成

度量配置

度量(Scale)用于定义数据的类型和展示方式，主要用于:

• 生成坐标轴刻度值
• 显示图例项
• 格式化数据展示文本

度量的定义