Why is my jqPlot not rendering a canvas?

Question

I am trying to use jqPlot for a bar graph and I can't get it to show anything.

I have included the jqPlot code and all the plugins. I am not receiving any errors whatsoever

I have copied the example code directly:

html:

<div id="jqplot" class="plot">

</div>

Javascript:

"use strict";
(function ($){

        $.jqplot('jqplot',  [[[1, 2],[3,5.12],[5,13.1],[7,33.6],[9,85.9],[11,219.9]]]);

})(jQuery);

It is adding the class 'jqplot-target' to the 'jqplot' div so the javascript must be working, yet it is not adding a canvas/chart to the div, it displays just an empty div with the added class to it.

Any ideas why this is not rendering?

I am using html5boilerplate as well, but I can't find any known issues with the two of them.

Thanks,

Thomas

Answer 1

I found the problem. I had the main container div that the jqplot is inside set to display:none on page load and once you click the 'enter' button is shows with .fadeIn()

I suppose it can't add the canvas when the parent is display: none; - I've got it to work by calling the $.jqplot inside the function that fades in the main container after the user clicks enter...