Charts in Highcharts JS v4.0.4 do not load completely - javascript

I am currently using Highcharts JS v4.0.4 (2014-09-02) [yes, we need to upgrade] and I noticed that sometimes our charts do not load all the way. For instance, on loading a page, I see something like this:
But then I hover over the chart, and additional sections appear:
Is this a know issue with this version of Highcharts? I am curious to know if this is something that can be fixed in this version or if it is a known issue only fixed with an upgrade. I previously tried to upgrade to the latest version and it broke some of our charts, so we opted to wait, since we didn't need to upgrade, but now we have this issue.

Related

c3.js chart data is loaded but graph does not render while page load and refresh

I tried some examples of c3.js Followed this link. And i got success in that. But i have one problem when i'm trying to load graph first time in any browser, it doesn't show me the graph.
And if i reload page once or twice it shows graph but data is loaded.
I'm using latest version 0.6.1 library in my project, even though chart not shown.
I googled quite a lot but i couldn't found any correct solution.
If anything is there to fix this issue suggest me. Thanks in advance.

Highcharts - bar chart columns too thin with too many series

I am developing a angular2 application using highcharts, but i have a problem about showing a bar chart. I have applied their sample code of highcharts to my application. It works. But when i added extra series to the chart, the columns becomes unreasonably too thin. my result
I separately tried the sample code on JSfiddle with adding extra series to the code. It works however. ... workable example
I've recently faced a very similar issue and even posted a question about it.
The solution seems to be pretty easy - for me the problem was in outdated highcharts (5.0.8) and highcharts modules(exporting, boost, highcharts-more, heatmap) (v. 5.0.8), so if you cannot reproduce your local behavior in jsfiddle try setting particular version of highcharts libraries like I've done here.
<script src="https://code.highcharts.com/5.0.8/highcharts.js"></script>
However when I updated to highcharts 5.0.14 the problem disappeared.
Hope this helps!
UPDATE
The issue was with a boost.js module, in particular with seriesThreshold property was set to 10 by default (now it is 50). Please find a detailed answer with example here
If you don't mind scrollable high-chart then this issue can be resolved.
Instead of Highchart use HighStock library, it will provide additional "scrollbar" option which you can combine with X-axis max option to show the data properly.
Here is the Updated Link for same code
scrollbar:{
enabled:true
},
xAxis: {
max:0
// rest of the code}
This answer will be good help to go in details.

Scrolling on mobile device using Highcharts and touchpunch

I am attempting to use Highcharts in a web application for mobile, but I'm running into the issue of scrolling over the charts on mobile as has been previously noted, i.e. Scrolling over highcharts graph.
I tried including the script touch-tooltip-fix.js - https://gist.github.com/skarface/2994906
This however doesn't work for me, neither do the other similar scripts that I've found online that are supposed to solve the issue. I'm wondering if the issue is that I'm using jQuery UI touch-punch? I've tried modifying the script but haven't had any luck.
Basically my questions are is this fixed now? And if so is there a way I can get it to work with touch-punch (or is that even the issue)?

In highstock 1.3.0, when zooming in full, the graph draws all messed up

I have tested with various graphs and this seems like a consistent problem.
I have a highstock graph, if you draw a lot of data and zoom out to the full view of the graph by using the sliders or the range selector, the whole graph draws all messes up.
I found an example fiddle that illustrate the issue.
http://fiddle.jshell.net/highcharts/qgprf/show/
I've used Chrome to get the path that highstock generated and then plotted just the path:
http://jsfiddle.net/MsFhh/
It's obvious that highstock is creating some tomfoolery.
For the sake of stackoverflow, here's some code
alert("I R code"); //Copying the huge svg path in here is kinda insane
Is there something that I can do to fix this?
PS: if I upgrade to the new highstock version, everything in our graphs breaks so updating is not an option :(
This is known bug of Highstock 1.3.0, alread y fixed in 1.3.3+. Reported here. You can modify sources to fix issue, or upgrade to latest version.
If you have issue with upgrading - let us know what kind, and we will try to fix them. Of course working fiddle with that issues is really appreciated.
The bug has been fixed. The fix for version 1.3.5 can be found here:
https://github.com/highslide-software/highcharts.com/issues/1651#issuecomment-25226662
Don't use the patch though. It doesn't fully fix the issue. It seems like 1.3.6 fixes everything that were causing the defect.
The patch can be seen here:
https://github.com/highslide-software/highcharts.com/commit/9607afd512473710b6aeb9bfceaf23549d285ff0

Highcharts zoom issue after upgrading to jQuery 1.8

I use Highcharts 2.2.5 to draw a number of area and bar charts.
I Just upgraded my app to jQuery 1.8 and started testing all my charts.
All appear ok, but when I zoom an area chart, I get tons (literally hundreds) of JavaScript errors saying "Error: Problem parsing d=0.99030204037363" (numbers change, sometimes d=1) and on the screen all I see are a bunch of dots where the chart was.
Resetting the zoom doesn't work either (yielding more errors, and no result). The only recourse at that point is to reload the page.
I tried looking online for any clashes between HC 2.2.5 and jQuery 1.8 but couldn't find anything. Switching back to jQuery 1.7.2 solves the problem, but still, one must look ahead...
Any assistance is appreciated,
Guy
After reporting the bug on github, per #MrObrian's suggestion, I got this reply:
It is already fixed for the next release - see
http://jsfiddle.net/highcharts/GJ4wR/. We're running the final tests
on that code now, hope to have it out by next week.
So all I have to do is wait 1 week :)

Categories

Resources