carInsightSystem_wxapp/components/option/multipleColumn.js

export default function multipleColumn(columnName = [], xMsg = [], data = [],) {
    const valData = []
    const color = ['#FF4852', '#FF6E25', '#FFBF00', '#20CC62', '#00D6D6', '#00AAFF', '#7257FF']
    for (let [index, i] of data.entries()) {
        let ojb = {
            name: i.name,
            type: 'bar',
            barGap: 0,
            emphasis: {
                focus: 'series'
            },
            data: i.data,
            itemStyle: {
                color: color[index]
            },
        }
        valData.push(ojb)
    }
    const option = {
        tooltip: {
            trigger: 'axis',
            backgroundColor: "#08182F",
            color: "#fff",
            borderColor: "#3373CC",
            textStyle: {
                color: "#fff", //设置文字颜色
                fontSize: 9
            },
            extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;",
            confine: true
        },
        legend: {
            data: columnName,
            textStyle: { //图例文字的样式
                color: 'black',
                fontSize: 8
            },
            left: 20,
            itemWidth: 10,
            itemHeight: 10,
            // borderRadius: 1, //圆角半径
        },
        grid: {
            left: 20,
            containLabel: true,
        },
        xAxis: {
            type: 'category',
            axisTick: {
                show: false
            },
            axisLabel: {
                textStyle: {
                    fontSize: 8
                }
            },
            data: xMsg
        },
        yAxis: [{
            type: 'value',
            axisLabel: {
                textStyle: {
                    fontSize: 8
                }
            },
        }],
        series: valData
    }
    return option
}