Logo Questions Linux Laravel Mysql Ubuntu Git Menu
HTML CSS JAVASCRIPT SQL PYTHON PHP BOOTSTRAP JAVA JQUERY R React Kotlin
 

Using Highcharts and displaying a message over or on the chart when there is no data

Tags:

javascript

jquery

asp.net-mvc-3

highcharts

I'd like to know if there is a built-in or accepted way to show a label or message over the chart (or where the chart would be) if there are no data series.

I couldn't find anything in the Highcharts docs and I'm trying to stay away from using jQuery (or just JavaScript in general) to check if the result has data and then changing the DOM on my own.

The data is coming in as json from a MVC 3 controller call if that helps or changes anything.

Ideally it would be a message that displays over an empty chart so users know a chart object is there.

Thanks!

like image 247
Josh R Avatar asked May 08 '13 21:05

Josh R

People also ask

How display no data available message in Highcharts?

To show 'no data' message on a pie chart, you need to remove data from a chart. Also, the 'no data' feature requires the file no-data-to-display. js to be loaded in the page. If you want to show some kind of info when data is hidden, you can add custom text with Chart.

What is plotOptions in Highcharts?

The plotOptions is a wrapper object for config objects for each series type. The config objects for each series can also be overridden for each series item as given in the series array. Configuration options for the series are given in three levels. Options for all series in a chart are given in the plotOptions.

What is Drilldown in Highcharts?

8, Highcharts has built-in support for drilldown. By giving a point configuration a drilldown option that corresponds to a series configuration in the drilldown. series array, the point is linked to a hidden series. When the point is clicked, this series is loaded in the chart and replaces the existing series.

1 Answers

There is now an official plugin which shows a 'No Data to Display' message, after the loading message, when there is no data loaded into the chart. I've found it to be quite handy when the user is allowed to select a time range from search and filter form, and no results are returned from the search. It looks much better than having an empty chart.

Here is a link announcing the plugin, and jsfiddle example.

http://highcharts.uservoice.com/forums/55896-general/suggestions/1065633-display-no-data-to-display

like image 79
Rick Suggs Avatar answered Oct 04 '22 02:10

Rick Suggs
Sign in to Comment

Related questions

How to debug JavaScript and PHP together in the same NetBeans (7.3) project?
Inheritance within Javascript
Where do i put my Knockout.js Extensions when using Typescript and requirejs
Affects to the server from running EventSources
What exactly does domain.dispose() do in nodejs? Are there any hooks?
PhoneGap games, canvas and slow javascript
Toggle contentEditable on click
Keypress event for Japanese text
"click" listener gets execute multiple time
Why is a frozen "enum" slower?
making ajax request in meteor helpers
Jquery resize() causing screen flickering and div offset
How to play sound when the current time equals to specific time
Uncaught TypeError: Illegal constructor – Using Bonsai.JS in Backbone.JS
RequireJS load string
How do I check for undefined values in IE8?
at hover append span one time
Get value of <select> the modern way?
Why is the JSON.stringify() replacer function not working?
Unable to set 'data' attribute for 'Object' tag in jQuery. [IE8 only]

Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!