echarts (次)配置项内容和展示

配置项如下
      let list = [{
                    date: "6号",
                    noise: 20,
                    windSpeed:21,
                    weather:25,
                    tem:10,
                    hum:8,
                    PM:14
                    
                },
                {
                    date: "7号",
                     noise: 22,
                    windSpeed:18,
                    weather:26,
                    tem:17,
                    hum:11,
                    PM:9
                },
                {
                    date: "8号",
                     noise: 17,
                    windSpeed:24,
                    weather:21,
                    tem:14,
                    hum:15,
                    PM:21
                },
                {
                    date: "9号",
                     noise: 20,
                    windSpeed:20,
                    weather:23,
                    tem:10,
                    hum:8,
                    PM:14
                },
                {
                    date: "10号",
                     noise: 20,
                    windSpeed:18,
                    weather:21,
                    tem:10,
                    hum:8,
                    PM:14
                },
                {
                    date: "11号",
                     noise: 20,
                    windSpeed:25,
                    weather:22,
                    tem:10,
                    hum:8,
                    PM:14
                },
                {
                    date: "12号",
                     noise: 20,
                    windSpeed:23,
                    weather:19,
                    tem:10,
                    hum:8,
                    PM:14
                }
            ];
            let dateList = [];
            let noiseYdata = [];
            let windYdata = [];
            let weatherYdata = [];
            let temYdata = [];
            let humYdata = [];
            let PMYdata = [];
            let lengendData = ['噪音','风速','天气','温度','湿度','颗粒悬浮物'];
            list.forEach(function(item,index){
                dateList.push(item.date);
                noiseYdata.push(item.noise);
                windYdata.push(item.windSpeed);
                 weatherYdata.push(item.weather);
                 temYdata.push(item.tem);
                 humYdata.push(item.hum);
                 PMYdata.push(item.PM);
            })
         
            option = {
                color: ["#2ea5c3", "#e08f68"],
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "shadow"
                    },

                    formatter: function(params) {
                        var tiplabel =
                            params[0].name +
                            "<br/>" +
                            '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
                            params[0].color.colorStops[0].color +
                            '"></span>' +
                            params[0].seriesName +
                            ":" +
                            params[0].value +
                            "<br/>" +
                            '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
                            params[1].color.colorStops[0].color +
                            '"></span>' +
                            params[1].seriesName +
                            ":" +
                            params[1].value+
                             "<br/>" +
                            '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
                            params[2].color.colorStops[0].color +
                            '"></span>' +
                            params[2].seriesName +
                            ":" +
                            params[2].value+
                             "<br/>" +
                            '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
                            params[3].color.colorStops[0].color +
                            '"></span>' +
                            params[3].seriesName +
                            ":" +
                            params[3].value+
                             "<br/>" +
                            '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
                            params[4].color.colorStops[0].color +
                            '"></span>' +
                            params[4].seriesName +
                            ":" +
                            params[4].value+
                              "<br/>" +
                            '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' +
                            params[5].color.colorStops[0].color +
                            '"></span>' +
                            params[5].seriesName +
                            ":" +
                            params[5].value
                        return tiplabel;
                    }
                },
                legend: {
                    data: lengendData,
                    left: "center",
                    icon: "circle",
                    textStyle: {
                        color: "#666"
                    }
                },
                grid: {
                    //top:80,
                    left: 10,
                    bottom: 5,
                    right: 10,
                    containLabel: true
                },
                xAxis: {
                    type: "category",
                    data: dateList,
                    axisLabel: {
                        tooltip: {
                            show: true
                        },
                        inside: false,
                        textStyle: {
                            fontSize: 14
                        },
                        interval: 0,
                        color: "#8F8F8F"
                    },
                    axisTick: {
                        show: false
                    },
                    axisLine: {
                        lineStyle: {
                           color: "#8F8F8F"
                        }
                    }
                },
                yAxis: [{
                    type: "value",
                    name:'(次)',
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: "#CDD4D9",
                            type:'dashed',
                        }
                    },
                    axisTick: {
                        show: false
                    },
                    axisLine: {
                        show:true,
                        lineStyle: {
                            color: "#8F8F8F"
                        }
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            fontSize: 14
                        },
                        formatter: function(value) {
                            return value;
                        },
                        color: "#8f8f8f"
                    }
                }],
                series: [{
                        name: lengendData[0],
                        barCategoryGap: "30%",
                        
                        itemStyle: {
                            
                            normal: {
                                borderRadius:[20,20,0,0],
                                label: {
                                    show: false,
                                },
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#FFEFDB"
                                    },
                                    {
                                        offset: 1,
                                        color: "#FFC67E"
                                    }
                                ]),
                            }
                        },
                        type: "bar",
                        data: noiseYdata
                    },
                    {
                        name: lengendData[1],
                        itemStyle: {
                            normal: {
                                borderRadius:[20,20,0,0],
                                label: {
                                    show: false,
                                },
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#8BE4FF"
                                    },
                                    {
                                        offset: 1,
                                        color: "#20A8D1"
                                    }
                                ])
                            }
                        },
                        type: "bar",
                        data: windYdata
                    },
                     {
                        name: lengendData[2],
                        itemStyle: {
                           
                            normal: {
                                 borderRadius:[20,20,0,0],
                                label: {
                                    show: false,
                                },
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#E2C5FD"
                                    },
                                    {
                                        offset: 1,
                                        color: "#A55DEB"
                                    }
                                ])
                            }
                        },
                        type: "bar",
                        data: weatherYdata
                    },
                     {
                        name: lengendData[3],
                        itemStyle: {
                            normal: {
                                borderRadius:[20,20,0,0],
                                label: {
                                    show: false,
                                },
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#FFD9C6"
                                    },
                                    {
                                        offset: 1,
                                        color: "#FF945E"
                                    }
                                ]),
                            }
                        },
                        type: "bar",
                        data: temYdata
                    },
                     {
                        name: lengendData[4],
                        itemStyle: {
                            normal: {
                                borderRadius:[20,20,0,0],
                                label: {
                                    show: false
                                },
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#B9D6FF"
                                    },
                                    {
                                        offset: 1,
                                        color: "#2765D1"
                                    }
                                ])
                            }
                        },
                        type: "bar",
                        data: humYdata
                    },
                     {
                        name: lengendData[5],
                        itemStyle: {
                            normal: {
                                borderRadius:[20,20,0,0],
                                label: {
                                    show: false,
                                },
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: "#C8FFE3"
                                    },
                                    {
                                        offset: 1,
                                        color: "#61D79B"
                                    }
                                ])
                            }
                        },
                        type: "bar",
                        data: PMYdata
                    }
                ]
            };
    
截图如下