I'm having a little trouble with Highcharts. I have a graph set up with a default stacked bar layout. It looks fine. The code is in an html file.
I then put the same code, no modifications, into an external .js file, and the second result is what I get. I'm totally stumped, I have no idea why this is happening. Any ideas?
The js file has a bunch of other code, but I don't think it should conflict with the graph generation...
Thanks.
Working Graph: http://i.stack.imgur.com/51QTV.png
Broken Graph: http://i.stack.imgur.com/VyDzK.png
Since you didn't provide any sample code, I'm going to wildly guess at causes:
The code in the external JS file /is indeed/ interfering with the graph generation. This may happen if it isn't being loaded properly with the onload event. Most Javascript should only be executed after the document has completely loaded (jQuery is good for this).
By putting the Highcharts code in an external file, you're breaking the order of loading. Perhaps, some of the code depends on other code that you're now loading later. Maybe it's trying to use a stylesheet that doesn't exist yet. Maybe some code before it is overwriting a global object, and some properties and methods are disappearing.
As a general rule, Javascript files should be loaded AFTER stylesheets, and most Javascript logic should execute after the document loads. This can either be done by attaching an onload="javascript:foo()" attribute to the body, or using $(foo); (where foo is a function) if you're using jQuery.
