移动端手势缩放怎样实现,现在是可以鼠标滚轮缩放echarts 折线配置项内容和展示

移动端实现双指手势缩放

配置项如下
      var symbolSize = 20;
            var data = [[15, 0]];

            option = {
                /*tooltip: {
                    triggerOn: 'none',
                    formatter: function (params) {
                        return 'X: ' + params.data[0].toFixed(2) + '<br>Y: ' + params.data[1].toFixed(2);
                    }
                },*/
                roam: true,
                grid: {
                },
                xAxis: {
                    min: -80,
                    max: 80,
                    type: 'value',
                    axisLine: {onZero: true,symbol:['none', 'arrow']},
                    axisTick: {show:false},
                    axisLabel: {show:false}
                },
                yAxis: {
                    min: -30,
                    max: 30,
                    type: 'value',
                    axisLine: {onZero: true,symbol:['none', 'arrow']},
                    axisTick: {show:false},
                    axisLabel: {show:false}
                },
                dataZoom: [

                    {
                        type: 'inside',
                        xAxisIndex: 0,
                        filterMode: 'empty'
                    },
                    {
                        type: 'inside',
                        yAxisIndex: 0,
                        filterMode: 'empty'
                    }
                ],
                series: [
                    {
                        id: 'a',
                        type: 'line',
                        smooth: true,
                        symbolSize: symbolSize,
                        data: data
                    }
                ]
            };


            if (!app.inNode) {
                setTimeout(function () {
                    // Add shadow circles (which is not visible) to enable drag.
                    myChart.setOption({
                        graphic: echarts.util.map(data, function (item, dataIndex) {
                            return {
                                type: 'circle',
                                position: myChart.convertToPixel('grid', item),
                                shape: {
                                    cx: 0,
                                    cy: 0,
                                    r: symbolSize / 2
                                },
                                invisible: true,
                                draggable: true,
                                ondrag: function(){
                                    data[dataIndex] = myChart.convertFromPixel('grid', this.position);
                                    // Update data
                                    if(data[dataIndex][0]>=option.xAxis.max || data[dataIndex][0]<=option.xAxis.min || data[dataIndex][1]>=option.yAxis.max || data[dataIndex][1]<=option.yAxis.min) {
                                        return false;
                                    }
                                    myChart.setOption({
                                        series: [{
                                            id: 'a',
                                            data: data
                                        }]
                                    });
                                },
                                ondragend: function(){
                                    data[dataIndex] = myChart.convertFromPixel('grid', this.position);
                                    console.log(data[dataIndex])
                                },
                                z: 100
                            };
                        })
                    });
                }, 0);

                window.addEventListener('resize', updatePosition);
            }

            myChart.on('dataZoom', updatePosition);

            function updatePosition() {
                myChart.setOption({
                    graphic: echarts.util.map(data, function (item, dataIndex) {
                        return {
                            position: myChart.convertToPixel('grid', item)
                        };
                    })
                });
            }
            function onPointDragging(dataIndex, dx, dy) {
                data[dataIndex] = myChart.convertFromPixel('grid', this.position);
                if(data[dataIndex][0]>=option.xAxis.max || data[dataIndex][0]<=option.xAxis.min || data[dataIndex][1]>=option.yAxis.max || data[dataIndex][1]<=option.yAxis.min) {
                    return false;
                }
                // Update data
                myChart.setOption({
                    series: [{
                        id: 'a',
                        data: data
                    }]
                });
            };
    
截图如下