Expected behaviour
When we set the series.bar.dragDrop.liveRedraw option to false, the guideBox "shadow" should cover the area from "zero" up to the point being dragged.
Actual behaviour
When dragging a negative bar, the guideBox "shadow" is capped and has incorrect height: being equal to only the small dragged part of the whole stack, instead of the accumulated stack value up to that particular point.
The problem persists even when we "fake" the negative columns - adding them to a separate reversed yAxis, as shown on the second demo attached. In this case the guide box looks like a single trembling line.
IMPORTANT: I observed the same behaviour for both types of chart: 'column' AND 'bar'.
NOTE: The guideBox works correctly for positive bars.
Live demo with steps to reproduce
-
Example with negative stacked columns: https://jsfiddle.net/tge1a9mb/
When I drag the lowest (green) point of the middle bar, here's how it looks like:
-
Example with "fake" negative columns (with second reversed yAxis): https://jsfiddle.net/e1uymb5z/
When I drag the lowest (green) point of the middle bar, here's how it looks like:
Product version
Using the latest version of both: highcharts.js and modules/draggable-points.js, see the live demos attached.
Highcharts JS v10.3.3 (2023-01-20)
Affected browser(s)
Tested using Mozilla Firefox 111.0 (64-bit) for Manjaro Linux.
Solution(s)???
I guess that's a bug which needs to be fixed, but in the meantime: is there a way to workaround this behaviour?
For example, can I modify the guide box somehow to work correctly?
Any help appreciated.
Thanks!
Piotr
Expected behaviour
When we set the
series.bar.dragDrop.liveRedrawoption tofalse, theguideBox"shadow" should cover the area from "zero" up to the point being dragged.Actual behaviour
When dragging a negative bar, the
guideBox"shadow" is capped and has incorrect height: being equal to only the small dragged part of the whole stack, instead of the accumulated stack value up to that particular point.The problem persists even when we "fake" the negative columns - adding them to a separate
reversedyAxis, as shown on the second demo attached. In this case the guide box looks like a single trembling line.IMPORTANT: I observed the same behaviour for both types of chart:
'column'AND'bar'.NOTE: The
guideBoxworks correctly for positive bars.Live demo with steps to reproduce
Example with negative stacked columns: https://jsfiddle.net/tge1a9mb/
When I drag the lowest (green) point of the middle bar, here's how it looks like:
Example with "fake" negative columns (with second
reversedyAxis): https://jsfiddle.net/e1uymb5z/When I drag the lowest (green) point of the middle bar, here's how it looks like:
Product version
Using the latest version of both:
highcharts.jsandmodules/draggable-points.js, see the live demos attached.Affected browser(s)
Tested using Mozilla Firefox 111.0 (64-bit) for Manjaro Linux.
Solution(s)???
I guess that's a bug which needs to be fixed, but in the meantime: is there a way to workaround this behaviour?
For example, can I modify the guide box somehow to work correctly?
Any help appreciated.
Thanks!
Piotr