教程

简介

G2 的全局变量决定了各种图表的样式和一些计算用的配置信息，用户可以用全局变量来实现以下功能：

  • 修改 G2 的默认配置信息；
  • 扩展 G2 的皮肤；

全局变量分类

G2 的全局变量分成 2 类：

  • 图表样式相关的参数，可以通过修改这些参数，调整 G2图表的样式；
  • 默认的度量配置信息，数据如果为 null 的处理策略等。

图表样式相关

  • 样式相关的配置参数，可详见 G2.Theme API;
  • Global 提供了 setTheme 方法用于主题修改，具体的使用请查看皮肤章节。

其他全局变量

Global 提供的另一种全局变量：同度量相关的配置信息如下所示：

var DEFAULT = {
  animate: true, // 是否执行动画
  widthRatio: { // 宽度所占的分类的比例
    column: 1 / 2, // 一般的柱状图占比 1/2
    rose: 0.9999999, // 玫瑰图柱状占比 1
    multiplePie: 1 / 1.3 // 多层的饼图、环图
  },
  // 度量的一些默认字段的配置信息
  scales: {
    '..x': {
      type: 'linear',
      min: 0,
      nice: false
    },
    '..y': {
      type: 'linear',
      min: 0,
      nice: false
    },
    '..level': {
      type: 'linear',
      min: 0,
      nice: false
    },
    '..value': {
      type: 'linear',
      min: 0
    },
    '..count': {
      type: 'linear',
      min: 0,
      alias: '数量'
    },
    '..percent': {
      type: 'linear',
      min: 0,
      max: 1,
      alias: '比例',
      formatter: percentFormat
    },
    '..proportion': {
      type: 'linear',
      min: 0,
      max: 1,
      alias: '百分比',
      formatter: percentFormat
    },
    '..density': {
      type: 'linear',
      min: 0,
      alias: '密度概率'
    },
    '..long': {
      type: 'linear',
      alias: '经度',
      nice: false
    },
    '..lant': {
      type: 'linear',
      alias: '纬度',
      nice: false
    },
    '..pieX': {
      type: 'cat',
      values: ['..pieX'],
      ticks: ['..pieX']
    } // 饼图默认X轴度量
  },
  connectNulls: false, // 是否忽视数据中的null的点，这个配置项影响折线图、区域图
  heatmapColors: 'rgb(125,125,248)-rgb(0,0,255)-rgb(0,255,0)-yellow-rgb(255,0,0)',
  heatmap: {
    radius: 50
  } // 热力图上点的半径大小
}