Skip to content

feat: Pie expansion animation behavior  #11029

@MohammadYounes

Description

@MohammadYounes

Version

4.2.1

Steps to reproduce

When loading Pie series along with data, the expansion animation is continues,

continues

Code Sample:

var data = [
    {"name":"A1B·1","value":92386},
    {"name":"BB1·","value":90611},
    {"name":"1BB","value":12596},
    {"name":"2BA·1","value":9438},
    {"name":"1BA","value":10049}
]
    
option = {
    series : [
        {
            type: 'pie',
            animationType:'expansion',
            animationDuration:5000,
            startAngle:0,
            endAngle:360,
            radius : ['50%','80%'],
            center: ['40%', '50%'],
            data: data // set along with series
        }
    ]
};

But when setting the data while the series has already been added, the expansion animation becomes discrete (per pie piece).

discrete

Code Sample:

var data = [
    {"name":"A1B·1","value":92386},
    {"name":"BB1·","value":90611},
    {"name":"1BB","value":12596},
    {"name":"2BA·1","value":9438},
    {"name":"1BA","value":10049}
]
    
option = {
    series : [
        {
            type: 'pie',
            animationType:'expansion',
            animationDuration:5000,
            animationDurationUpdate:5000,
            startAngle:0,
            endAngle:360,
            radius : ['50%','80%'],
            center: ['40%', '50%']
        }
    ]
};

//set after rendering
setTimeout(function() {
   myChart.setOption({
       series:[
           {
            data: data
           }
        ]
   })
}, 500);

Is there away to force continues animation even if data is added later?

What is expected?

Continues Pie Chart Animation

What is actually happening?

Discrete Pie Chart Animation

Metadata

Metadata

Assignees

Labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions