echarst渐变设置，缩放

tootilp:

tooltip: {
                    show: true,
                    trigger: 'item',
                    formatter: function(params) {
                        // 返回值就是html代码可以使用标签
                        return `${params.data.product}</br>进场：${params.data.xx1 + '单位' } </br> 出场：${params.data.xx2 + '单位'}`
                    }
                },

折线图：

series: [
                    {
                        data: [],
                        type: 'line',
                        symbol: 'circle',
                        symbolSize: 6, // 拐点圆的大小
                        itemStyle: {
                            normal: {
                                color: 'rgba(19, 249, 159, 0.5)', // 改变折线点的颜色
                                borderColor: 'rgba(19, 249, 159, 1)', // 拐点边框颜色
                                // 区域
                                areaStyle: {
                                    // 渐变
                                    color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
                                        // 颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
                                        { offset: 0, color: 'rgba(7, 226, 141, 1)' },
                                        { offset: 1, color: 'rgba(76, 143, 243, 0)' }
                                    ])
                                },
                                lineStyle: { // 系列级个性化折线样式
                                    width: 2,
                                    type: 'solid',
                                    color: 'rgba(19, 249, 159, 1)'
                                }
                            }

                        }
                    }

                ],
                // 缩放
                dataZoom: [
                    {
                        show: false, // 是否显示滑动条
                        type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
                        startValue: 0, // 从头开始。
                        endValue: 7, // 一次性展示8个。
                        handleSize: 7
                    },
                    {
                        type: 'inside',
                        start: 0,
                        end: 3
                    }
                ]

柱状图：

series: [
                    {
                        type: 'bar',
                        barWidth: 10, // 柱宽
                        itemStyle: {
                            normal: {
                                // 颜色渐变
                                color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                    offset: 0,
                                    color: '#0099FF'
                                }, {
                                    offset: 1,
                                    color: '#0033FF'
                                }])
                            }
                        }
                    },
                    {
                        type: 'bar',
                        barWidth: 10, // 柱宽
                        itemStyle: {
                            normal: {
                                // 颜色渐变
                                color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                    offset: 0,
                                    color: '#58FFB9'
                                }, {
                                    offset: 1,
                                    color: '#00908E'
                                }])
                            }
                        }
                    }
                ],
                dataZoom: [{
                    show: false, // 是否显示滑动条
                    type: 'slider', // 这个 dataZoom 组件是 slider 型 dataZoom 组件
                    startValue: 0, // 从头开始。
                    endValue: 8, // 一次性展示8个。
                    handleSize: 8
                },
                {
                    type: 'inside',
                    start: 0,
                    end: 3
                }
                ]