Question

当没有数据显示时，有没有办法显示空图表而不是“无数据可用”消息？

data2 = [ 
    { 
      "key" : "A key" , 
      "values" : []
    }

];

谢谢！

Answer 1

你可以通过拥有一个包含空数组的空数组来“破解”这个：

data2 = [ 
  { 
    "key" : "A key" , 
    "values" : [[]]
  }
];

Answer 2

当您想要在图表空白时显示noData消息时，Lars提供的答案很有效。

最近我有动态加载内容的图表。我发现了一个类似的问题Updating with no data does not clear old data from the chart.

如果图表填充了数据，然后在清空数据后调用更新，则 noData 文本将覆盖现有数据。

考虑是否应该从图表中清除当前数据   可能会混淆同时看到两者。

我无法找到一个干净的解决方案，所以这就是我为克服它所采取的措施：

使用Lars回答清空图表：

data2 = [{
    "key" : "A key",
    "values" : [[]]
}];

然后添加以下代码。

d3.select('#chart svg').append("text")
        .attr("x", "235")
        .attr("y", "35")
        .attr("dy", "-.7em")
        .attr("class", "nvd3 nv-noData")
        .style("text-anchor", "middle")
        .text("My Custom No Data Message");

即使我正在寻找适当的解决方案，也要显示noData文本而不覆盖现有数据。但就目前而言，这非常有效。

希望它有所帮助，试图达到同样的目的。

Answer 3

您可以在图表创建过程中调用noData并传递字符串：

（CoffeeScript的）

self.chart = nv.models.lineChart()
               .margin  left: 100, right: 100
               .useInteractiveGuideline true
               .transitionDuration 150
               .showLegend true
               .showYAxis true
               .showXAxis true
               .noData 'no data, there is'

NVD3 - 显示空图表而不是noData消息

3 个答案: