ECharts

Question

所以我正在使用库 ECharts 为网站上的各种数据创建一些图表和图形。这是我第一次使用该库，我对 Javascript/jQuery 还很陌生。我想要做的是将 xAxis 数据设置为本地页面的结果，该页面将 return 一个 JSON 对象，其中包含一个包含星期几的数组。能做到这一点后，我打算用同样的方式加载Series数据。

return编辑的jSON是这个

当我尝试为 xAxis 设置数据时，我的操作如图所示

xAxis: [{
    type: 'category',
    boundaryGap: false,
    data: function(){
        $.ajax({
            type: "POST",
            url: "ajax/getData.php?test=t&graph_last_days=d&days=7",
            cache: false,
            success: function(result){
                return result.data;
                //console.log(result.data);
            }
        });
    }

}],

但是，我一直收到错误 Uncaught TypeError: o.slice is not a function 并且只有在我尝试使用这种设置方法时才会输出此错误数据。除此之外，如果我尝试对外部页面中的数据创建一个函数 return 并为其设置一个变量，每当我尝试将其打印到控制台时，它都会显示 undefined

如果我不使用尝试加载外部数据的方法，而是像这样预定义数据

xAxis: [{
    type: 'category',
    boundaryGap: false,
    data: [
        'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'
    ]
}]

然后就没有错误了，一切正常

谁能看出问题所在？

Answer 1

似乎在与一些人交谈后，唯一可用的示例用法或文档是他们拥有的与我的问题密切相关的示例 here。

如果其他人想要一些与 ajax 或使用 ECharts 加载动态数据相关的示例，那么这里有一些 （英文） *

有用提示

如果您不会说中文并且您正在使用某种翻译器来翻译他们的代码示例；请注意，Google Translate and Bing Translator 等网站通过执行诸如

之类的操作来错误翻译 JS 中使用的标点符号是很常见的

将带单引号的数组翻译成带单引号的数组和双引号：因此导致语法错误。
正在从对象中删除逗号 (,)。
将 Semi-colon 的 (;) 更改为冒号 (:)，甚至删除它们。

Answer 2

echarts 从 Ajax 调用

推送数据的完整示例

data.importPorts -> 字符串数组 data.importBD -> 对象数组 { clientanem : [4,5,6,7,3]}

$.get("/Home/Graph1", { clients: "403,300", years: "2012" })
          .done(function (data) {
              var option = {
                  tooltip: {
                      show: true
                  },
                  legend: {
                      data: (function () {
                          var res = [];
                          for (var name in data.importBD) {
                              res.push(name);
                          };
                          return res;
                      })()
                  },
                  xAxis: [
                      {
                          type: 'category',
                          data: (function () {
                              var res = [];
                              data.importPorts.forEach(function (i) {
                                  res.push(i);
                              });
                              return res;
                          })()
                      }
                  ],
                  yAxis: [
                      {
                          type: 'value'
                      }
                  ],
                  series: [
                      {

                      }
                  ]
              };

              for (var name in data.importBD) {
                  var obj = {
                      name: name,
                      type: "bar",
                      data: data.importBD[name]
                  };

                  option.series.push(obj);

              }
              // Load data into the ECharts instance
              imprtChart.setOption(option);
          });

ECharts - 为外部加载的数组设置选项

ECharts - Set options to externally loaded arrays

javascript

jquery

json

charts