全局命名空间 G2,包含:
常量 Constants
G2.version; // 返回 G2 当前的版本
类 Classes
Chart
主体图表类,用于控制图表的创建、绘制和销毁。
详细文档见 Chart API。
Shape
构成图表具体的形状类。
详细文档见 Shape API。
Scale
度量 Scale 类,是将原始数据转换为图形坐标的关键桥梁。
详细文档见 Scale API。
Animate
负责 G2 图表的动画生成,以及提供自定义动画的机制。
详细文档见 Animate API。
Global
包含 G2 内部所有常量的定义以及皮肤。比如你可以:
通过
G2.Global.fontFamily获取 G2 图表默认的字体;通过
G2.Global.setTheme('dark')来切换或者设置皮肤,详细信息见 图表样式设置教程。通过
G2.Global.renderer = 'svg'指定默认用 svg 渲染。
Util
G2 默认提供的常见的工具类,采用类似 lodash 的接口。
如下:
const Util = {each: require('lodash/each'),map: require('lodash/map'),isObject: require('lodash/isObject'),isNumber: require('lodash/isNumber'),isString: require('lodash/isString'),isFunction: require('lodash/isFunction'),...};
DomUtil
用于操作 dom 相关的工具类。具体该工具类包含的方法如下:
| 方法 | 参数说明 | 返回结果 | 
|---|---|---|
getBoundingClientRect(node) | 
node:HTMLElement,dom 节点 | 
返回该节点在页面中的位置,返回结果格式为: {top: , bottom: , left: , right} | 
getStyle(dom, name) | 
dom:HTMLElement,DOM 节点;name:String,样式名 | 
返回该节点对应样式名 name 的具体样式。 | 
modifyCSS(dom, css) | 
dom:HTMLElement,DOM 节点;css:Object,样式属性 | 
修改对应节点的 css 样式,返回修改样式后的 dom 对象。 | 
createDom(str) | 
str:String,Dom 字符串 | 
按照传入的 str 创建 dom 节点,并返回创建的节点。 | 
getRatio() | 
— | 返回屏幕的像素分辨率。 | 
getWidth(el) | 
el:HTMLElement,dom 节点 | 
返回 dom 节点的宽度,不包含 padding、border | 
getHeight(el) | 
el:HTMLElement,dom 节点 | 
返回 dom 节点的高度,不包含 padding、border | 
getOuterWidth(el) | 
el:HTMLElement,dom 节点 | 
返回 dom 节点的宽度,包含 padding、border | 
getOuterHeight(el) | 
el:HTMLElement,dom 节点 | 
返回 dom 节点的高度,包含 padding、border | 
addEventListener(target, eventType, callback) | 
target:HTMLElement,DOM对象;eventType:String,事件名;callback:Function,回调函数 | 
添加事件监听器 | 
requestAnimationFrame(fn) | 
fn:Function,回调函数 | 
用于定时循环操作。 | 
MatrixUtil
用于操作矩阵、向量的工具类。该工具类提供了操作三阶矩阵、二维向量和三维向量的方法,这些方法直接使用了 glMatrix 库,并且在其基础上添加了一些额外的遍历方法,具体如下代码:
G2.MatrixUtil.mat3: 三阶矩阵,详见 http://glmatrix.net/docs/module-mat3.html;G2.MatrixUtil.vec2: 二维向量,详见 http://glmatrix.net/docs/module-vec2.html;G2.MatrixUtil.vec3: 三维向量,详见 http://glmatrix.net/docs/module-vec3.html;G2.MatrixUtil.transform(m, ts): 对三阶矩阵参数 m 按照 ts 进行变换,变换包含t: translate,s: scale,r: rotate,m: multiply,具体使用如下:
G2.MatrixUtil.transform([ 1, 0, 0, 0, 1, 0, 0, 0, 1 ], [[ 'r', Math.PI / 2 ],[ 't', 10, 10 ],[ 'r', -1 * Math.PI / 2 ]]);
PathUtil
用于操作图形路径的工具类。具体提供的方法如下:
| 方法 | 参数说明 | 返回结果 | 
|---|---|---|
parsePathString(pathString) | 
pathString:String,字符串格式的路径,如 ‘M 10,39 L 20,50’ | 
将字符串格式的路径转换为数组格式,[ [ ‘M’, 10, 39 ], [ ‘L’, 20, 50 ] ] | 
parsePathArray(pathArray) | 
pathArray:Array,数组格式的路径,如 [ [ ‘M’, 10, 39 ], [ ‘L’, 20, 50 ] ] | 
将数组格式的路径转化为字符串,’M 10,39 L 20,50’ | 
pathTocurve(path) | 
path:Array,数组格式的路径 | 
路径转曲 | 
pathToAbsolute(path) | 
path:Array,数组格式的路径 | 
将所有的路径命令转换为绝对定位 | 
catmullRomToBezier(pointsArray) | 
pointsArray:Array,点的数组,如 [ 10, 12, 22, 1, … ] | 
将传入的点(至少四组点)转曲 | 
intersection(path1, path2) | 
path1:Array,数组格式的路径;path2:Array,数组格式的路径 | 
两条路径差值计算 | 
G
G2 图表的底层渲染引擎。
方法 Functions
G2.track(true); // 开启打点监控G2.track(false); // 关闭打点监控
该方法用于 G2 情况的打点监控,默认处于开启状态,如果您不想让我们知道您的版本使用情况,请使用调用 G2.track(false) 关闭。
!注意:当一个环境下同时存在 3.0.0 与 3.0.0 以下两个版本的 G2 时,请使用 G2_3 命名空间来使用 3.0.0 的版本。
