为啥用的echarts里的同样option代码，生成的效果不同

option = {
            tooltip: {
                trigger: 'axis',
                order: 'seriesDesc',
                // backgroundColor: "#F4F7FD",
                axisPointer: {
                    type: 'cross',
                    label: {
                        backgroundColor: '#6a7985'
                    }
                }
            },
            legend: {
                data: [
                    {
                        name: '当日扫码量',
                        icon: 'rect',
                        itemStyle: {
                            color: 'rgb(232, 24, 255)'
                        }
                    },
                    {
                        name: '扫码人数',
                        icon: 'rect',
                        itemStyle: {
                            color: 'rgb(30, 215, 255)'
                        }
                    },
                ],
                right: 30,
                top: 0,
                bottom: 20,
                itemWidth: 50,
                itemHeight: 5,
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    boundaryGap: false,
                    data: ['06-10', '06-11', '06-12', '06-13', '06-14', '06-15', '06-16']
                }
            ],
            yAxis: [
                {
                    type: 'value'
                }
            ],
            series: [

                {
                    name: '扫码人数',
                    type: 'line',
                    stack: 'Total',
                    smooth: true,
                    lineStyle: {
                        width: 3
                    },
                    itemStyle: {
                        color: 'rgb(30, 215, 255)',
                    },
                    showSymbol: false,
                    areaStyle: {
                        opacity: 0.8,
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: 'rgb(150, 163, 247)'
                            },
                            {
                                offset: 1,
                                color: 'rgb(248, 247, 255)'
                            }
                        ])
                    },
                    emphasis: {
                        focus: 'series'
                    },
                    data: [2, 2, 3, 4, 3, 3, 2]
                },
                {
                    name: '当日扫码量',
                    type: 'line',
                    stack: 'Total',
                    smooth: true,
                    lineStyle: {
                        width: 3
                    },
                    itemStyle: {
                        color: ' rgb(232, 24, 255)',
                    },
                    showSymbol: false,
                    areaStyle: {
                        opacity: 0.8,
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: 'rgb(216, 97, 230)'
                            },
                            {
                                offset: 1,
                                color: 'rgb(253, 232, 255)'
                            }
                        ])
                    },
                    emphasis: {
                        focus: 'series'
                    },
                    data: [4, 3, 3, 3, 3, 4, 3,]
                },
            ]
        };// option2 = {
        放到自己的页面，

里面，扫码人数和当日扫码量上下顺序就翻转了，怎么解决

这个为啥没有生效，还有前面图例的颜色和后面数值的颜色如何同一颜色，文字颜色还是白色？求大神帮忙