amCharts：如何优雅地管理来自 dataLoader 的数据不足

Question

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

我一直在思考如何优雅地处理不时从 API 传递的数据不足，以便图表显示诸如 "No Data Available".[=11 之类的消息=]

示例图表代码：

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 returns 是否为空，如果是，则在图表上写一个计划 "No Data Available"？

Answer 1

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

此时您可以修改它并基于它执行任何其他任务，例如添加 "No data" 标签。

即：

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

amCharts：如何优雅地管理来自 dataLoader 的数据不足

amCharts: How to gracefully manage lack of data from dataLoader

javascript

amcharts