rw941123 2023-03-24 16:31 采纳率: 80%
浏览 23
已结题

vue中使用ECharts只有x,y轴,没有数据

按照网上搜的改了下代码,只能看见两条轴,没有数据,请问是代码哪里有问题吗?

data(){
xData: [],
      yData: [],
      tableData: [],
}


//获取所有库存物资
async getStockList() {
      const {data: res} = await this.$http.get("allStock", {params: this.queryInfo});
      this.stockList = res.data;//库存列表
      this.total = res.numbers;//总用库存
      this.xData = [];
      this.yData = [];
      const $this = this;
      //构建表格条形统计图的数据
      this.tableData.forEach(function(e) {
        console.log(e)
        $this.xData.push(e.itemname);
        $this.yData.push(e.numbers);
      });
      //重新绘制表格
      this.getEchartData();
    },

getEchartData(){
      var myChart = echarts.init(document.getElementById('tiaoxing'));
      var option = {
        title: {
          text: "库存条形图"
        },
        tooltip: {},
        legend: {//图例
          data: ["库存量"]
        },
        xAxis: {
          //x轴设置
          data: this.xData
        },
        yAxis: {},
        series: [
          {
            name: "库存量",
            data: this.yData, //y即接口方法传递过来的参数也是y轴的数据(x等同于res.data.yData)
            type: "bar", //类型
          },
        ],
      };
      myChart.setOption(option); //通过setOption()方法生成图表
    },

 mounted() {
    this.getEchartData();
  },
  • 写回答

2条回答 默认 最新

  • 简效 2023-03-24 17:21
    关注

    没看到你 tableData 赋值的操作 ,这不是个空的数组么 ,

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 4月1日
  • 已采纳回答 3月24日
  • 创建了问题 3月24日

悬赏问题

  • ¥15 为什么我运行这个网络会出现以下报错?CRNN神经网络
  • ¥20 steam下载游戏占用内存
  • ¥15 CST保存项目时失败
  • ¥15 树莓派5怎么用camera module 3啊
  • ¥20 java在应用程序里获取不到扬声器设备
  • ¥15 echarts动画效果的问题,请帮我添加一个动画。不要机器人回答。
  • ¥15 Attention is all you need 的代码运行
  • ¥15 一个服务器已经有一个系统了如果用usb再装一个系统,原来的系统会被覆盖掉吗
  • ¥15 使用esm_msa1_t12_100M_UR50S蛋白质语言模型进行零样本预测时,终端显示出了sequence handled的进度条,但是并不出结果就自动终止回到命令提示行了是怎么回事:
  • ¥15 前置放大电路与功率放大电路相连放大倍数出现问题