G2Plot怎么配置数据源来更新数据
时间: 2023-02-08 08:55:01 浏览: 402
g2plot-theme-builder::lipstick:为G2Plot构建主题配置:chart_increasing:
G2Plot 支持多种数据源,包括 JSON 数组、CSV 文件、远程 API 等。要配置数据源,可以在初始化图表时传入 data 属性,如:
```javascript
const data = [
{ year: '1991', value: 3 },
{ year: '1992', value: 4 },
...
];
const chart = new G2Plot.Line(container, {
data,
xField: 'year',
yField: 'value',
});
```
也可以在图表已经渲染后使用 `chart.updateConfig({ data })` 方法更新数据源。
如果数据源是远程 API,可以使用 fetch 或 axios 等工具请求数据,然后将返回结果传入 data 属性。
```javascript
axios.get('/api/data').then((res) => {
chart.updateConfig({
data: res.data,
});
});
```
需要注意的是,数据源中的字段名称和类型需要与配置中定义的 xField 和 yField 等属性相匹配。
阅读全文