[Bug] custom series NPE when removing element if transition animation is specified

Open 100pah opened this issue 2 years ago • 0 comments

Version

5.4.1

Link to Minimal Reproduction

No response

Steps to Reproduce

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/echarts.min.js"></script>
    </head>
    <body>
        <style>
        </style>

        <button id="remove">remove</button>
        <div id="main0" style="height: 500px;"></div>

        <script>
            var option;

            option = {
                xAxis: {},
                yAxis: {},
                series: {
                    type: 'custom',
                    data: [[11, 22], [33, 44]],
                    renderItem: function (params, api) {
                        return {
                            type: 'rect',
                            transition: 'all',
                            enterFrom: {style: {opacity: 0}},
                            leaveTo: {style: {opacity: 0}},
                            x: 100,
                            y: 100,
                            shape: {
                                x: 0,
                                y: 0,
                                width: 100,
                                height: 100
                            },
                            style: {
                                fill: 'green',
                                opacity: 1
                            }
                        }
                    }
                }
            };

            var dom = document.getElementById('main0');
            var chart = echarts.init(dom);

            var btnDom = document.getElementById('remove');
            btnDom.onclick = function () {
                var option2 = {
                    xAxis: {},
                    yAxis: {},
                    series: {
                        type: 'custom',
                        data: [],
                        renderItem: function (params, api) {
                            return {
                                type: 'rect',
                                transition: 'all',
                                enterFrom: {style: {opacity: 0}},
                                leaveTo: {style: {opacity: 0}},
                                x: 100,
                                y: 100,
                                shape: {
                                    x: 0,
                                    y: 0,
                                    width: 100,
                                    height: 100
                                },
                                style: {
                                    fill: 'green'
                                }
                            }
                        }
                    }
                };
                chart.setOption(option2);
            };

            chart.setOption(option);


        </script>

    </body>
</html>

Click the button "remove", See the browser console, NPE occurs.

Current Behavior

NPE

Expected Behavior

Working correctly.

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

https://github.com/apache/echarts/blob/c308ec76f20f5dadcd04d2a10eeee9e06fbdad81/src/chart/custom/CustomView.ts#L232

customInnerStore(el).option is never assigned

Mar 20 '23 12:03 100pah