echarts 画柱状折现，利用XY轴呈现表格

let option = {
                grid: {
                    x: 140,
                    y: 60,
                    x2: 30,
                    y2: 150
                },
                title:{
                    text:'新疆整体经济发展主要成就',
                    textStyle:{
                        color:'#fff'
                    },
                    left:'center'
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: "cross",
                        crossStyle: {
                            color: 'rgba(204,204,204,0.58)'
                        }
                    }
                },
                legend: {
                    align: "right",
                    itemGap: 7,
                    orient: "vertical",
                    textStyle: {
                        color: "auto"
                    },
                    bottom: 45,
                    left: 0,
                    data: legendData
                },
                xAxis: [
                    {
                        type: "category",
                        offset: 0,
                        axisLabel: {
                            fontWeight: "bold",
                            show: true,
                            interval: 0, // 强制显示全部刻度名
                            textStyle: {
                                fontSize: "14px",
                                color: '#fff'
                            }
                        },
                        lineStyle: {
                            color: '#f00',
                            width: 1,
                            type: 'solid',
                        },
                        data: xNameData,
                    },
                    {//下方表格的竖线
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 50, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        axisTick: {
                            length: -105, // 延长刻度线做分组线
                            inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                            lineStyle: {
                                color: 'rgba(204,204,204,0.58)'
                            } // 非必须，仅为了演示，明显标示出分组刻度线
                        },
                        max: 10,
                        interval: 2,
                        axisLabel: {
                            inside: true, // 使刻度名称相对轴线在上面与原x轴相接，默认在轴线下方
                            interval: 0 // 强制显示全部刻度名
                        },
                        data: [""]
                    },
                    {//下方表格的竖线  第一条线
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 0, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        axisTick: {
                            length: -105, // 延长刻度线做分组线
                            inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                            lineStyle: {
                                color: "#999"
                            } // 非必须，仅为了演示，明显标示出分组刻度线
                        },
                        data: [""]
                    },
                    {
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 25, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        max: 6,
                        axisTick: {
                            alignWithLabel: true,
                        },
                    },
                    {
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 45, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        interval: 1,
                        axisTick: {
                            length: 0, // 延长刻度线做分组线
                            inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                        },
                        axisLabel: {
                            inside: true, // 使刻度名称相对轴线在上面与原x轴相接，默认在轴线下方
                            interval: 0,// 强制显示全部刻度名
                            margin: 0,
                            textStyle: {
                                fontSize: "12px",
                                color: colors[0]
                            }
                        },
                        data: arr1
                    },
                    {
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 65, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        axisTick: {
                            length: 0, // 延长刻度线做分组线
                            inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                        },
                        axisLabel: {
                            inside: true, // 使刻度名称相对轴线在上面与原x轴相接，默认在轴线下方
                            interval: 0,// 强制显示全部刻度名
                            margin: 0,
                            textStyle: {
                                fontSize: "12px",
                                color: colors[1]
                            }
                        },
                        data: arr2
                    },
                    {
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 85, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        axisTick: {
                            length: 0, // 延长刻度线做分组线
                            inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                        },
                        axisLabel: {
                            inside: true, // 使刻度名称相对轴线在上面与原x轴相接，默认在轴线下方
                            interval: 0,// 强制显示全部刻度名
                            margin: 0,
                            textStyle: {
                                fontSize: "12px",
                                color: colors[2]
                            }
                        },
                        data: arr3.map(item=>item.toFixed(3))
                    },
                    {
                        position: "bottom", // 将分组x轴位置定至底部，不然默认在顶部
                        offset: 105, // 向下偏移，使分组文字显示位置不与原x轴重叠
                        axisTick: {
                            length: 0, // 延长刻度线做分组线
                            inside: true, // 使刻度线相对轴线在上面与原x轴相接，默认在轴线下方
                        },
                        axisLabel: {
                            inside: true, // 使刻度名称相对轴线在上面与原x轴相接，默认在轴线下方
                            interval: 0,// 强制显示全部刻度名
                            margin: 0,
                            textStyle: {
                                fontSize: "12px",
                                color: colors[3]
                            }
                        },
                        data: arr4.map(item=>item.toFixed(3))
                    },
                ],
                yAxis: [{
                    type: "value",
                    axisLabel: {
                        formatter: "{value}",
                        textStyle: {
                            fontSize: "14px",
                            color: '#307bef'
                        }
                    },
                    axisLine: {
                        show: false,
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(204,204,204,0.58)',    // 坐标轴线线的颜色
                            width: '1',    // 坐标轴线线宽
                            type: 'solid',    // 坐标轴线线的类型（solid实线类型；dashed虚线类型；dotted点状类型）
                        },
                    },
                    axisTick: {
                        show: false
                    },
                }, { 
                    type: "value",
                    axisLabel: {
                        formatter: "{value}",
                        textStyle: {
                            fontSize: "14px",
                            color: '#307bef'
                        }
                    },
                    axisLine: {
                        show: false,
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(204,204,204,0.58)',    // 坐标轴线线的颜色
                            width: '1',    // 坐标轴线线宽
                            type: 'solid',    // 坐标轴线线的类型（solid实线类型；dashed虚线类型；dotted点状类型）
                        },
                    },
                    axisTick: {
                        show: false
                    },
                }],
                series: [
                    {
                        name: legendData[0],
                        type: "bar",
                        data: arr1,
                        itemStyle: {
                            color: colors[0]
                        },
                        symbol: 'rect',  //取消折点圆圈  可选样式：'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
                        symbolSize: 8, //设定实心点的大小
                        smooth: false //折线是否平滑
                    },
                    {
                        name: legendData[1],
                        type: "bar",
                        data: arr2,
                        itemStyle: {
                            color: colors[1]
                        },
                        symbol: 'roundRect',  //取消折点圆圈  可选样式：'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
                        symbolSize: 8, //设定实心点的大小
                        smooth: false //折线是否平滑
                    },
                    {
                        name: legendData[2],
                        type: "line",
                        data: arr3,
                        itemStyle: {
                            color: colors[2]
                        },
                        symbol: 'circle',  //取消折点圆圈  可选样式：'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
                        symbolSize: 8, //设定实心点的大小
                        smooth: false, //折线是否平滑
                        yAxisIndex:1,

                    },
                    {
                        name: legendData[3],
                        type: "line",
                        data: arr4,
                        itemStyle: {
                            color: colors[3]
                        },
                        yAxisIndex:1,
                        symbol: 'circle',  //取消折点圆圈  可选样式：'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none'
                        symbolSize: 8, //设定实心点的大小
                        smooth: false //折线是否平滑
                    },
                ]
            }