sencha gxt stacked bar with non-zero axis min behaving incorrectly
Asked Answered
L

1

11

I am building a stacked bar chart, however when I specify a min value for the axis the rendering of bars gets warped, and the axis scale/steps is erroneous. A line series I have added does however work as expected.

Here is the initial chart : no setMin

When I supply minimum/maximum values to the axis:

NumericAxis<MarketDataDetailsDecorator> axis = new NumericAxis<>();
axis.setPosition(Chart.Position.BOTTOM);
axis.setMinimum(995); // only this line
axis.setMaximum(1016);// and this line get added

with setMin

you can see the bars work on completely different values, but the blue lines remain correct. Also the axis increments in a non linear fashion it steps : 995,997,999,1001,1003,1006,1008, 1010, 1012, 1014,1016

Is this a bug, or two - or am I missing something in the api ?

Here is a gist highlighting the problem : https://gist.github.com/NimChimpsky/b4dc3dddc629ffefc7be2469eaa87d3a

I am trying to show a zoomed in version of the bar chart, the values range from 1002.5 - 1005.5, the first chart is correct but the second chart seems to be randomly assigning values ?

Lavernalaverne answered 17/7, 2019 at 6:20 Comment(1)
for what its worth, the company seem virtually impossible to interact with - can't even post on their forum/report a bugLavernalaverne
R
6

I tested with this bar chart & also with OP's gist on my local.


Non-Zero Axis Min Value Issue

This is definitely a bug with the draw logic (identical issue but on extjs). Ignoring the change with maximum value, which also adds further trouble to this issue, imagine we update the minimum value of the bottom axis to n, if the bar's original height on the drawn chart should've been h, it will be reduced to h - n (derived from h * (h-n)/h).

For example;

  • here h ~= 1000, and n = 500, so as we see the invalid height of the drawn bars are 1000 - 500 = 500, so 50% length for bars...

    enter image description here

  • here h ~= 1000, and n = 750, and 1000 - 750 = 250, 25%

    enter image description here

  • and with OP's example h ~= 1000, and n = 995, therefore we see extremely short 0.5% length bars.

Sadly I am unable to fix this only through available methods to users, without accessing the terrible code in BarSeries, and even doing so will be troublesome to maintain, not the best to modify a 3rd party non-open source code. I suggest creating a ticket to this company...


Out of Axis Range Data Issue

When the range of bottom axis reduced to [95-105], the behaviour gets erratic, bars stack up behind the x-axis.

enter image description here

So it seems when the data is out of range, this kinda bug occurs, there is no inherent hide/filter logic for dataset on the chart.


Axis Label Step Inconsistency Issue

This seems to be an issue with approximation of step calculation with default settings, which is 10 steps (There is actually other logic, but unless some more custom settings have been used, it will be 10). If you give a manual range, and if (max - min) % 10 != 0, then you will have such issue due to approximation of step calculation.

For example, let's use [90-115], with max - min = 25, and this creates the following issue;

enter image description here

and if you just do the math;

step = (max - min) / 10 = 25 / 10 = 2.5

value for labels;

  1. 90 + (2.5 x 0) = 90
  2. 90 + (2.5 x 1) = 92.5 ~= 93
  3. 90 + (2.5 x 2) = 95
  4. 90 + (2.5 x 3) = 97.5 ~= 98
  5. ...

So it is just the mismatch between range & default step amount. You can modulate this with maybe using a custom step amount with axis.setSteps() on the bottom axis using a value that will divide the value max - min evenly.

Reward answered 24/7, 2019 at 7:23 Comment(4)
@Lavernalaverne why not just use the regular bar chart? It seems to work with exact conditions? Apart from the issue with data being out of range, same thing occurs on that one as well, so my answer can help only if you can switch to non-stacked bars =) For I don't see any extra stackable set of data in your exampleMonograph
no, I haven't included the stacked data here. This example just shows the inconsistency. The line series is plotted in one position, while the bar chart is in another, even though the data is the same. I haven't even begun to stack in the example (just to keep it simple), but I do need it for my usecaseLavernalaverne
the imgur you linked shows the problem, the green bars should extend to the same points as the line series. The data is all in range, that is not relevant to my problem.Lavernalaverne
@Lavernalaverne I updated the answer, but sadly I am unable to resolve it at all... It is a very core bug in the draw logic, and modifying that is really difficult without support from the vendor...Monograph

© 2022 - 2024 — McMap. All rights reserved.