空气监测echarts piecewise配置项内容和展示

       option = {
     backgroundColor: '#0a1256',
     //浮动框
     tooltip: {},
     //图例
     legend: {
         right: '12%',
         bottom: '4%',
         textStyle: {
             color: '#fff',
             fontSize: '13'
         },
         itemGap: 20,
         itemWidth: 10,
         itemHeight: 10,
         icon: 'circle',
         data: ['PM2.5', 'CO2', 'SO']
     },
     grid: {
         left: '8%',
         top: '15%',
         bottom: '14%',
         width: '86%',
     },
     visualMap: [{
         type: 'piecewise',
         show: false,
         pieces: [{
             gt: 0,
             lte: 60,
             color: '#69dbf7'
         }, {
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: 'SO',
         seriesIndex: 2
     }, {
         type: 'piecewise',
         show: false,
         pieces: [{
             gt: 0,
             lte: 60,
             color: '#1be57a'
         }, {
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: 'CO2',
         seriesIndex: 1
     }, {
         type: 'piecewise',
         show: false,
         pieces: [{
             gt: 0,
             lte: 60,
             color: '#feb01e'
         }, {
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: 'PM2.5',
         seriesIndex: 0
     }, {
         type: 'piecewise',
         show: false,
         pieces: [{
             gt: 0,
             lte: 60,
             color: '#69dbf7'
         }, {
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: 'SO',
         seriesIndex: 5
     }, {
         type: 'piecewise',
         show: false,
         pieces: [{
             gt: 0,
             lte: 60,
             color: '#1be57a'
         }, {
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: 'CO2',
         seriesIndex: 4
     }, {
         type: 'piecewise',
         show: false,
         pieces: [{
             gt: 0,
             lte: 60,
             color: '#feb01e'
         }, {
             gte: 60,
             color: '#e5421b'
         }],
         seriesName: 'PM2.5',
         seriesIndex: 3
     }],
     //x轴
     xAxis: {
         axisLine: {
             lineStyle: {
                 color: '#132987'
             }
         },
         axisLabel: {
             textStyle: {
                 color: '#FFF',
                 fontSize: 12
             },
         },
         //刻度线
         axisTick: {
             show: false
         },
         //坐标轴显示值
         data: ["1时", "2时", "3时", "4时", "5时", "6时", "7时", "8时"]
     },
     //y轴
     yAxis: {
         min: 0,
         max: 100,
         axisLabel: { //  改变y轴字体颜色和大小
             //formatter: '{value} m³ ', //  给y轴添加单位
             textStyle: {
                 color: '#fff',
                 fontSize: 12,
             },
         },
         //坐标轴线
         axisLine: {
             show: false,
         },
         //刻度线
         axisTick: {
             show: false
         },
         //在grid区域中的分隔线
         splitLine: {
             show: true,
             lineStyle: {
                 color: '#132987',
             }
         },
     },

     //
     series: [{
         name: 'PM2.5',
         type: 'line',
         symbolSize: [0, 0],
         itemStyle: {
             color: '#feb01e'
         },
         data: [43, 50, 41, 18, 28, 25, 26, 40],
     }, {
         name: 'CO2',
         type: 'line',
         symbolSize: [0, 0],
         itemStyle: {
             color: '#1be57a'
         },
         data: [21, 30, 37, 39, 23, 37, 5, 50]
     }, {
         name: 'SO',
         type: 'line',
         symbolSize: [0, 0],
         itemStyle: {
             color: '#69dbf7'
         },
         data: [76, 58, 60, 38, 49, 59, 78, 60]
     }, { //水波纹点
         name: 'PM2.5',
         type: 'effectScatter',
         symbolSize: [5, 5],
         rippleEffect: {
             period: 1,
             scale: 4,
             brushType: 'fill'
         },
         itemStyle: {
             color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
                 offset: 0,
                 color: '#feb01e'
             }, {
                 offset: 1,
                 color: 'rgba(254,176,30,.3)'
             }])
         },
         data: [43, 50, 41, 18, 28, 25, 26, 40]

     }, { //水波纹点
         name: 'CO2',
         type: 'effectScatter',
         symbolSize: [5, 5],
         rippleEffect: {
             period: 1,
             scale: 4,
             brushType: 'fill'
         },
         itemStyle: {
             color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
                 offset: 0,
                 color: '#1be57a'
             }, {
                 offset: 1,
                 color: 'rgba(27,229,122,.3)'
             }])
         },
         data: [21, 30, 37, 39, 23, 37, 5, 50]

     }, { //水波纹点
         name: 'SO',
         type: 'effectScatter',
         symbolSize: [5, 5],
         rippleEffect: {
             period: 1,
             scale: 4,
             brushType: 'fill'
         },
         itemStyle: {
             color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [{
                 offset: 0,
                 color: '#69dbf7'
             }, {
                 offset: 1,
                 color: '#aefbc3'
             }])
         },
         markLine: {
             symbol: "none",
             label: {
                 normal: {
                     show: false,
                 }
             },
             lineStyle: {
                 type: "solid",
                 color: 'rgba(210,56,56,.6)',
                 width: 2
             },
             data: [{
                 yAxis: 60
             }]
         },
         data: [76, 58, 60, 38, 49, 59, 78, 60]

     }]
 };