使用appendData分多次(每次数据量大概1万5，总数据量50万-150万+)渲染数据，会导致整个页面很卡顿，cpu达到120%-250%左右！

[ZhuYumo1020]

Version

4.0

Steps to reproduce

使用appendData分批加载数据，并且sampling设置为默认，即不做降采样策略，如果做这个的话会影响整体的曲线。

What is expected?

期望能够顺畅加载，不卡顿

What is actually happening?

页面很卡顿，导致cpu一直飙涨

Any additional comments? (optional)

 function getConfig() {
        const legendData = chartData.map(item => item.name);
        const yData = [];
        for (let index = 0; index < legendData.length; index++) {

            yData.push({
                name: legendData[index],
                type: 'line',
                smooth: 0.4,
                // sampling: 'average',
                connectNulls: true,
                showSymbol: false,
                hoverAnimation: false,
                data: chartData[index].points
            })
        }

        const option = {
            title: {
                text: selectedKey
            },
            tooltip: {
                trigger: 'axis',
                // axisPointer: false,
                // animation: false,
                padding: 10,
                formatter: function (params) {
                    let res = moment(params[0].axisValue).format('MM-DD HH:mm:ss.SSS') + '<br/>';
                    for (let i = 0, l = params.length; i < l; i++) {
                        res += (i === 0 ? '' : '<br />') + params[i].marker + params[i].seriesName + ' : ' + params[i].value[1];
                    }
                    return res;
                },
                axisPointer: {
                    animation: false
                }
            },
            color: ['blue', 'yellow', 'green'],
            legend: {
                data: legendData
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '10%',
                containLabel: true
            },
            backgroundColor: 'transparent',
            xAxis: {
                type: 'time',
                axisLabel: {
                    formatter: (function (value) {
                        return moment(value).format('MM-DD HH:mm:ss.SSS');
                    })
                }
            },
            yAxis: [{
                type: 'value',
                // boundaryGap: [0, '100%'],
                // min: 0.98,
                // max: 1.1
            }],
            dataZoom: [{
                // startValue: xAxisData[0],
                // start: 0,
                // end: 100,
                filterMode: 'empty',
                textStyle: {
                    color: '#fff'
                }
            }, {
                type: 'inside'
            }],
            series: yData
        };

        return option;
    }

appendData

    for (let index = 0; index < chartData.length; index++) {
                chartInstanceRef.current.appendData({
                    seriesIndex: index,
                    data: chartData[index].points
                })

                chartInstanceRef.current.resize();
            }

求解决方案，不然整个页面太卡了，什么都操作不了！感谢官方的各位大佬，打扰了！

[ZhuYumo1020]

@pissangchartInstanceRef.current.resize(); 这个有没有影响？但是如果不加这个appendData后图形没有变化。

[ZhuYumo1020]

@Ovilia 小姐姐可以帮忙看下这个问题吗？

[github-actions[bot]]

This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.

[github-actions[bot]]

This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!