dataset数据集的时候怎么对应多个series-bar 比如有4个横坐标,每一个横坐标显示一个不同的series-bar?

dataset数据集的时候怎么对应多个series-bar 比如有4个横坐标 每一个横坐标显示一个不同的series-bar
目前的错误写法:(这个代码在实际项目中会报错Invalide sourceFormat: unknown)

option = {
        title: {
          text: '伸缩纵向位移',
          left: 'center',
          textStyle: {
            fontWeight: 500,
            fontSize: 25
          }
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
              type: 'cross'
          }
        },
        legend: {
          data: [
                "北过渡墩下游",
                "南过渡墩上游",
                "北过渡墩上游",
                "南过渡墩下游"
            ],
          right: 0,
          icon: 'rect',
          itemWidth: 24,
          itemHeight: 5,
          width: 300,
          textStyle: {
            width: 100,
            overflow: 'truncate'
          }
        },
        dataset: [
            {
                soure: [
                    "北过渡墩下游",
                    -0.31
                ]
            },
            {
                soure: [
                    "南过渡墩上游",
                    -1.2
                ]
            },
            {
                soure: [
                    "北过渡墩上游",
                    0.59
                ]
            },
            {
                soure: [
                    "南过渡墩下游",
                    -0.3
                ]
            }
        ],
        grid: {
            left: '5%',
            top: '30%',
            right: 0
        },
        xAxis: {
          boundaryGap: true,
          type: 'category',
          data: [
                "北过渡墩下游",
                "南过渡墩上游",
                "北过渡墩上游",
                "南过渡墩下游"
            ],
          // scale: true,
          axisTick: {
            show: false,
            alignWithLabel: true
          },
          axisLine: {
              symbol: ['none', 'arrow'],
              onZero: true
          }
         
        },
        yAxis: {
          // interval: 300,
          // min: 120,
          // max: -120,
          nameLocation: 'end',
          name: '单位:mm' + '\n' + '频率:20Hz',
          scale: true,
          axisLabel: {
              show: false
          },
          axisLine: {
            show: true,
            symbol: ['none', 'arrow']
          },
          splitLine: {
            show: false
          }
        },
        series: [
            {
                name: "北过渡墩下游",
                // data: [1],
                datasetIndex: 0,
                type: "bar"
            },
            {
                name: "南过渡墩上游",
                data: [1],
                datasetIndex: 1,
                type: "bar"
            },
            {
                name: "北过渡墩上游",
                // data: [1],
                datasetIndex: 2,
                type: "bar"
            },
            {
                name: "南过渡墩下游",
                // data: [1],
                datasetIndex: 3,
                type: "bar"
            }
        ]
    }

需要达到的效果:
1668763488035.png
想问一下有没有解决的办法

阅读 2.7k
1 个回答
✓ 已被采纳

已解决 写法错了

option = {
        title: {
          text: '伸缩纵向位移',
          left: 'center',
          textStyle: {
            fontWeight: 500,
            fontSize: 25
          }
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
              type: 'cross'
          }
        },
        legend: {
          data: [
                "北过渡墩下游",
                "南过渡墩上游",
                "北过渡墩上游",
                "南过渡墩下游"
            ],
          right: 0,
          icon: 'rect',
          itemWidth: 24,
          itemHeight: 5,
          width: 300,
          textStyle: {
            width: 100,
            overflow: 'truncate'
          }
        },
        dataset: [
            {
                soure: [[
                    "北过渡墩下游",
                    -0.31
                ]]
            },
            {
                soure: [[
                    "南过渡墩上游",
                    -1.2
                ]]
            },
            {
                soure: [[
                    "北过渡墩上游",
                    0.59
                ]]
            },
            {
                soure: [[
                    "南过渡墩下游",
                    -0.3
                ]]
            }
        ],
        grid: {
            left: '5%',
            top: '30%',
            right: 0
        },
        xAxis: {
          boundaryGap: true,
          type: 'category',
          data: [
                "北过渡墩下游",
                "南过渡墩上游",
                "北过渡墩上游",
                "南过渡墩下游"
            ],
          // scale: true,
          axisTick: {
            show: false,
            alignWithLabel: true
          },
          axisLine: {
              symbol: ['none', 'arrow'],
              onZero: true
          }
         
        },
        yAxis: {
          // interval: 300,
          // min: 120,
          // max: -120,
          nameLocation: 'end',
          name: '单位:mm' + '\n' + '频率:20Hz',
          scale: true,
          axisLabel: {
              show: false
          },
          axisLine: {
            show: true,
            symbol: ['none', 'arrow']
          },
          splitLine: {
            show: false
          }
        },
        series: [
            {
                name: "北过渡墩下游",
                // data: [1],
                stack: 'total',
                datasetIndex: 0,
                type: "bar"
            },
            {
                name: "南过渡墩上游",
                data: [1],
                stack: 'total',
                datasetIndex: 1,
                type: "bar"
            },
            {
                name: "北过渡墩上游",
                // data: [1],
                stack: 'total',
                datasetIndex: 2,
                type: "bar"
            },
            {
                name: "南过渡墩下游",
                // data: [1],
                stack: 'total',
                datasetIndex: 3,
                type: "bar"
            }
        ]
    }
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题