antvis/G2
Do you want to work on this issue?
You can request for a bounty in order to promote it!
waveIn 动画支持更新图形 #4852
pearmini posted onGitHub
目前使用 waveIn 动画更新数据的时候,还是从 0 度旋转到最终的角度,期望能从起始角度开始。
import { Chart } from '@antv/g2';
const chart = new Chart({
theme: 'classic',
container: 'container',
width: 200,
height: 200,
});
chart
.interval()
.coordinate({ type: 'radial', innerRadius: 0.7, outerRadius: 0.95 })
.data([{ name: 'CPU', percent: 27, color: 'rgba(90, 132, 226, 1)' }])
.encode('x', 'name')
.encode('y', 'percent')
.encode('color', 'color')
.encode('key', 'name')
.encode('size', 100)
.scale('y', { domainMax: 100 })
.scale('color', { type: 'identity' })
.tooltip({ name: '已使用', channel: 'y' })
.axis(false)
.style('radius', 26)
.style('shadowColor', 'color')
.style('shadowBlur', 10)
.style('shadowOffsetX', -1)
.style('shadowOffsetY', -1)
.animate('enter', { type: 'waveIn', duration: 1000 })
.animate('update', { type: 'waveIn' });
chart.render().then(() => {
chart.changeData([
{ name: 'CPU', percent: 40, color: 'rgba(90, 132, 226, 1)' },
]);
});