Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

custom no data label in nvd3 scatter chart

Tags:

d3.js

nvd3.js

I am trying to have custom message instead of the "No Data Available" message which is displayed. I am using nvd3 scatter / bubble chart. I came across a suggestion here

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

but I want to change the message. I looked at the source scatter.js but did not find "No Data Available" message. Do I need to modify another source file? How can I do so?

like image 379
Dinesh Avatar asked May 10 '14 14:05

Dinesh


2 Answers

Looking at the source, it seems that you can set the message using .noData():

chart.noData("Nothing to see here.");
like image 144
Lars Kotthoff Avatar answered Nov 09 '22 09:11

Lars Kotthoff


If you happen to use the Angular NVD3 wrapper, the way to set the custom message is through chart options, simply:

$scope.options = {
    chart: {
      ...
      noData: 'Your custom message',
      ...
    }
  };

I have prepared a simple demo plunker: http://plnkr.co/edit/hORaQh?p=preview

like image 43
Atais Avatar answered Nov 09 '22 09:11

Atais