移动端部分手机上下滑动出现报错?echarts 折线配置项内容和展示

这是个x轴数据很多的图表,允许图表左右拖动拉出未显示的数据,本页面还有其他界面,允许页面下拉刷新,当页面频繁下拉上啦的时候报错ignored attempt to cancel a touchmove event with cancelable=false for example because scrolling is in progress and cannot be interrupted at echarts.min.js

配置项如下
      var colors = ['#4C8CF5', '#DF6FAC', '#979797'];
option = {
    color: colors,
    dataZoom: [{
        type: 'inside',
        start: 0,
        end: 20
    }],
    legend: {
        textStyle: {
            color: '#999999',
        },

        top: 0,

        itemWidth: 0,
        itemHeight: 0,
        data: ['(mm)', '(℃)']
    },

    grid: {
        width: '80%',
        top: 10,
        bottom: 32,
        left: '13%',
        borderColor: '#EEEEEE',
        axisPointer: {
            handle: {
                show: true
            }
        }
    },
    xAxis: [{
        type: 'category',
        axisTick: {
            alignWithLabel: true
        },
        axisLine: {
            onZero: true,
            lineStyle: {
                color: colors[2]
            }
        },
        axisTick: {
            length: 0,
        },
        boundaryGap: false,
        data: []
    }, {
        show: false,
        type: 'category',
        axisTick: {
            alignWithLabel: true
        },
        axisLine: {
            onZero: false,
            lineStyle: {
                color: colors[0]
            }
        },
        data: []
    }],
    yAxis: [{
            type: 'value',
            min: 100,
            splitNumber: 10,
            axisLine: {
                onZero: true,
                lineStyle: {
                    color: colors[2]
                }
            },
            axisTick: {
                length: 0,
            },
            silent: true,
            splitLine: {
                lineStyle: {
                    color: '#EEEEEE'
                }
            }
        }, {

            type: 'value',
            min: 0,
            splitNumber: 5,
            axisLine: {
                onZero: true,
                lineStyle: {
                    color: colors[2]
                }
            },
            axisTick: {
                length: 0,
            },
            silent: true,
            splitLine: {
                lineStyle: {
                    color: '#EEEEEE'
                }
            }
        }

    ],
    series: [{
        type: 'line',
        yAxisIndex: 1,
        smooth: true,
        showSymbol: false,
        areaStyle: {
            color: {
                type: 'linear',
                x: 0,
                y: 0,
                x2: 0,
                y2: 0.99,
                colorStops: [{
                    offset: 0,
                    color: 'rgba(97,166,246,0.2)' // 0% 处的颜色
                }, {
                    offset: 1,
                    color: 'rgba(255,255,255,0.07)' // 100% 处的颜色
                }],
                globalCoord: false // 缺省为 false
            }
        },
        data: []
    }, {
        type: 'line',
        yAxisIndex: 0,
        smooth: true,
        showSymbol: false,
        areaStyle: {
            color: {
                type: 'linear',
                x: 0,
                y: 0,
                x2: 0,
                y2: 0.99,
                colorStops: [{
                    offset: 0,
                    color: 'rgba(243,215,229,0.77)' // 0% 处的颜色
                }, {
                    offset: 1,
                    color: 'rgba(244,218,244,0.06)' // 100% 处的颜色
                }],
                globalCoord: false // 缺省为 false
            }
        },
        data: []
    }]
};
    
截图如下