-
坐标系详解
[TOC] 坐标系详解G2 支持的坐标系坐标系和图形直角坐标系极坐标系层叠柱状图到嵌套环图层叠柱状图到饼图坐标系和视觉通道坐标系的接口设计属性方法极坐标的特殊属性 坐标系详解 在视觉通道中识别度最高，同时支持定性（分类）数据和定量数据的视觉通道是位置 position。数据会被映射到空间的位置上，我们将这个空间定义成坐标系。常见的坐标系： 直角坐标... -
图表类型
[TOC] 图表类型几何标记自由度图表类型图表类型和图形形状如何设计 Shape支持的视觉通道接收的数据格式柱状图需要的数据条数需要的点的个数 图表类型 数据可视化的核心在于可视化编码，而可视化编码由几何标记和视觉通道组成。在可视化设计中我们将常见的几何标记定义成图表类型。 根据几何标记可以代表的数据维度来划分，几何标记分为： 零维，点是常见的零维... -
常见问题
[TOC] G2 常见问题图表如何支持自适应宽度如何格式化坐标轴文本怎么控制坐标轴刻度线个数以及刻度线的间距如何控制坐标轴的显示的数值范围如何格式化图例的显示文本如何设置图例项的初始状态如何绘制多 y 轴图表如何绘制混合图表如何修改 tooltip 的显示内容如何导出图片 G2 常见问题 图表如何支持自适应宽度 (1) 方式一 const char... -
Layout
Layout Layout Layout.Tree属性nodeswidthheightdxdychildrenFiledcollapsedField方法getNodesgetEdgesfindNoderesetLayout.linear属性nodesedgeshasWeightthicknessmarginy方法getNodesresetLayout.... -
Util
Util Util 方法substituteucfirstisObjectisNumberisNumericisBooleanisFunctionisArrayisDateisNullmixUtil.mix(target, source1, source2….source)Util.mix(true, target, source1, source2…... -
G2
[TOC] G2 全局 G2 对象，在 script 标签引入 g2.js 文件后获得，或者在 AMD 环境中通过 require(‘g2’) 获得。 通过 G2 对象可调用的属性： G2.ChartG2.UtilG2.GlobalG2.StatG2.ScaleG2.ShapeG2.FrameG2.LayoutG2.AnimateG2.CanvasG2.... -
G2 图表组成
[TOC] G2 图表组成简介坐标轴 AXES图例 LEGEND几何标记 GEOM提示信息 TOOLTIP辅助标记 GUIDE G2 图表组成 简介 为了更好得使用 G2 进行数据可视化，我们需要了解 G2 图表的组成以及相关概念。 完整的 G2 图表组成如下图所示： 坐标轴 AXES 每个图表通常包含两个坐标轴，在直角坐标系（笛卡尔坐标系）下... -
装载数据
[TOC] 装载数据如何装载数据支持的数据格式JSON 数组DataView 对象更新数据更新数据清理图形语法使用 DataView 更新 装载数据 如何装载数据 chart 对象支持两种数据载入的方式： 方式 1：data 属性传入 const chart = new G2.Chart({ id: 'c1', width: 600, h... -
Scale 度量
[TOC] Scale 度量度量的定义度量的功能度量的类型linearloglog 度量的使用场景powtimecattimeCat Scale 度量 度量的定义 度量 Scale，是数据空间到图形空间的转换桥梁，负责原始数据到 [0, 1] 区间数值的相互转换工作，从原始数据到 [0, 1] 区间的转换我们称之为归一化操作。 不同的数据类型对应不... -
列定义操作
[TOC] 什么是列定义如何操作chart.source(data, defs)chart.scale()Demo 演示 什么是列定义 所谓的列定义，即是对度量 scale 的操作。 G2 默认提供了一套生成度量的机制，但是这套机制并不能满足全部的需求，因此我们为用户提供了手动指定度量类型的方法，以满足多样的可视化需求，这种使用方式我们称之为 列定义...
