antv g2plot中的条形图 渐变填充

在 antv g2plot 中使用渐变填充的条形图，可以使用 interval 几何标记，并在 style 中设置 fill 属性为渐变色。

以下是一个示例代码：

import { Chart } from '@antv/g2plot';

// 数据
const data = [
  { year: '2010', sales: 100 },
  { year: '2011', sales: 200 },
  { year: '2012', sales: 300 },
  { year: '2013', sales: 400 },
  { year: '2014', sales: 500 },
];

// 渐变色
const gradient = {
  type: 'linear',
  x1: 0,
  y1: 0,
  x2: 0,
  y2: 1,
  colorStops: [
    { offset: 0, color: '#008dff' },
    { offset: 1, color: '#00bfff' },
  ],
};

// 创建图表
const chart = new Chart({
  container: 'container',
  autoFit: true,
  height: 400,
});

// 设置数据
chart.data(data);

// 绘制柱状图
chart.interval().position('year*sales').style({
  fill: gradient,
});

// 渲染图表
chart.render();

在上面的示例中，使用 linear 渐变类型，从上到下渐变，起始颜色为 #008dff，结束颜色为 #00bfff。并通过 style 方法设置 fill 属性为渐变色。