g2plot 更新数据
时间: 2023-08-01 07:06:35 浏览: 339
要更新G2Plot的数据,可以使用 `changeData` 方法。该方法接受一个新的数据源作为参数,将数据源更新到图表中。下面是一个示例代码:
```javascript
import { Line } from '@antv/g2plot';
const data = [
{ year: '1991', value: 3 },
{ year: '1992', value: 4 },
{ year: '1993', value: 3.5 },
{ year: '1994', value: 5 },
{ year: '1995', value: 4.9 },
{ year: '1996', value: 6 },
{ year: '1997', value: 7 },
{ year: '1998', value: 9 },
{ year: '1999', value: 13 },
];
const linePlot = new Line('container', {
data,
xField: 'year',
yField: 'value',
title: {
text: 'Line Plot'
}
});
// 更新数据
const newData = [
{ year: '1991', value: 5 },
{ year: '1992', value: 6 },
{ year: '1993', value: 4 },
{ year: '1994', value: 8 },
{ year: '1995', value: 5.5 },
{ year: '1996', value: 7 },
{ year: '1997', value: 9 },
{ year: '1998', value: 11 },
{ year: '1999', value: 15 },
];
linePlot.changeData(newData);
```
在上面的示例代码中,我们首先创建了一个 `Line` 类型的图表实例,并传入了一个数据源和一些配置项。然后,我们使用 `changeData` 方法将数据源更新为新的数据源 `newData`。这样就可以实现 G2Plot 的数据更新。
阅读全文