amCharts:如何优雅地管理dataLoader中缺少的数据

时间:2015-09-06 07:15:16

标签: javascript amcharts

我正在使用amCharts通过dataLoader功能提取数据来生成图形等。

我一直在考虑如何优雅地处理从API传递的数据不足,以便图表显示消息,例如" No Data Available"。

图表代码示例:

var chart = new AmCharts.AmSerialChart();

chart.dataLoader = { url: "/api/blobs"};
chart.categoryField = "site";
chart.type="serial";
chart.theme = "light";

var graph = new AmCharts.AmGraph();
graph.valueField = "visit";
graph.type = "column";
graph.fillAlphas = 1;
graph.lineAlpha = 0;

var valuesAxis = new AmCharts.ValueAxis();
valuesAxis.integersOnly = true;

graph.balloonText = "[[category]]: <b>Total: [[value]]</b>";
chart.depth3D = 45;
chart.angle = 45;
chart.addGraph(graph);
chart.addValueAxis(valuesAxis);

chart.write("blob_chart"); 

任何人都知道如何设法检查dataLoader是否返回null,如果是,则写一个计划&#34; No Data Available&#34;而在图表上呢?

1 个答案:

答案 0 :(得分:2)

您可以使用Data Loader的postProcess处理程序检查数据是否为空,然后添加相对标签。 postProcess是一个自定义函数,在传递给图表之前将加载的数据传递给它。

此时您可以修改它以及执行基于它的任何其他任务,例如添加“无数据”标签。

即:

chart.dataLoader = {
  url: "/api/blobs",
  postProcess: function(data, options) {
    if (data === null) {
      data = [];
      options.chart.addLabel("50%", "50%", "No Data Available");
    }
    return data;
  }
};