Highstock bar rounded markers in new version - javascript

We have upgraded our higstock version from v1.2.5 to the latest (v1.3.9).
We have had to do many minor tweaks and changes, which we have now sorted to make it work as it did before, however, there are a couple of issues that remain and are proving hard to resolve.
The first is rounded end points on one of our bar charts;
postimg.org/image/6uqvr5szd
(The highlighted end points used to be flat and not overlap)
postimg.org/image/426uym7eh
(How it looks in old version (preferred))
The second (which seems like it could be related) is as follows;
postimg.org/image/n0gyaz9cr
(Again more roundedness)
postimg.org/image/yuncfy43b/
(How it looks in old version (preferred))
I have checked borderRadius, symbol, marker settings etc. etc. but nothing obvious is causing these issues.
Furthermore we have many other types of charts which all seem to be fine.
NB:
The second issues are an attempt at a basic Gantt chart as described by Torstein Hønsi in this post;
http://highcharts.uservoice.com/forums/55896-general/suggestions/804783-gantt-chart
(I would also have added the images here, or the links, but StackOverflow forbid it because of my low reputation!)
As always, any help appreciated.

Related

Highcharts' navigator and dependency arrow (ganttChart)

While tinkering with Gantt charts, I noticed that using navigator and dependency arrows sometimes behaves weirdly depending on the current zoom.
On this fiddle (hopefully, for you too), when fully de-zoomed, the dependency arrow splits and sometimes disappears (though it seems to happen intended because it happens when the start date of the task gets out of the "view").
This doesn't seem to be happening when removing the min and maxattributes of yAxis in the chart configuration, in this demo, but doesn't seem to always fix it
But, for instance, if you add the navigator to the "Interactive Gantt" demo, the bug still happens.
Does anyone have an idea ? I don't think I saw an Issue about that on the git repo.
This issue was reported on Highcharts github and it is already resolved, see: https://github.com/highcharts/highcharts/issues/10804
As mentioned there it is expected to be included in the next maintenance version v7.1.3.

Why am I seeing two different point types in Highcharts?

I have a highcharts synchronization example working fine on JS Fiddle:
http://jsfiddle.net/profnimrod/5vcc6z40/18/
However, when I integrate this into a larger app I'm seeing something weird. When I do some debugging on the JS Fiddle version I see that in each point in the:
chart.series[0].points
array has the following fields:
However, when I view the same array in my larger app I see the following:
I am, as far as I can tell, utilizing the current (6.0.3) version of Highcharts in both cases. What's going on?
The difference in my chart options was that in my larger app I had the 'boost' option enabled. This is used to handle charts containing many 1000s of points. It seems that it uses a different 'point' class when in boost mode which explains the issue I observed above.

Chart.js plugins overlapping tooltips

I have two plugins, one which displays a horizontal line across a chart (example image show below) and one which displays a label inside a donut chart. In both cases when the tooltip is triggered for the base chart, it displays beneath (i.e. lower z-position) the plugin's drawing.
I know I can create a fully customized tooltip which might solve this problem, but wanted to know if there was a configuration I'm not seeing or a simpler solution.
I can post code if necessary, but didn't think it'd be useful.
I believe that you should have posted the code for clarity. Since you are talking about plugins, you have overridden at least one plugin method. One of the methods you have overridden is probably afterDraw. Overriding afterDraw would present the problem you mention, I believe. Try changing afterDraw to afterDatasetsDraw. Look at the docs for the plugin methods that can be overridden. You want the lines to be drawn before the tooltip is drawn, so drawing the lines right after the datasets are drawn seems like a nice solution. Maybe using beforeDatasetsDraw instead would be a nice solution too, depending on whether you would want the bars to be above the lines or not.

dc.js / crossfilter performance issue 12,000+ rows of CSV data

I'm having some performance issues with using dc.js and crossfilter. I'm creating a set of graphs displaying different dimensions of some cycling data (code here, data here, viewable here). The charts render after a few second or two, but the main performance issues occur when clicking any of the graphs - the transition animations kind of "snap" after a delay, and it's a bit jarring. I've also noticed that just removing the empty line chart at the top of the page causes the three remaining graphs to perform much better with transitions returning to normal.
I've looked at a few similar questions such as this one, but this doesn't necessarily seem applicable since I'm not splitting by multiple dimensions at one time. Is 12,000 records just getting toward the upper end of what crossfilter can handle? The file is only about 1.4 MB, so that seems a little surprising that there would be issues at this size, but maybe all this demonstrates is a lack of understanding on my part. Would greatly appreciate any pointers on this one as I'm stumped. Thanks for reading.
Usually this means something is slowing down the Crossfilter updates, resulting in the browser freezing until most of the transition is already done.
The only thing that sticks out at me is that you have 2 variable declarations in the accessor function for your dayOfWeek dimension. It would be better to define that property up-front when you load your data.
The only other possible problem I see is the Date object in your data and the dimension defined based on it. These types of complex objects can slow things down quite a bit (and the d3.js date parsing isn't extremely fast), but I don't see that showing up as a major problem in the Chrome profiler, so I don't think that's what's slowing you down here.

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