GoJs version: 2.2.8
We have graduated panels that we use as input sliders or knobs. We want to display a scale of value between min and max with standardized increments that looks like this: 0.25, 0.50 or 1.
The initial problem:
graduatedTickUnit: 1,
graduatedMin: 0,
graduatedMax: 10.1,
The increments will be 1 but the last tick will be 10 and 10.1 will not be displayed. So here the increments are correct but we need to find a way to always display the maximum as the last tick.
Potential solution to this problem:
Our idea was to set graduatedTickUnit to 0.1, or anything that fits the floating point precision of min or max, and use graduatedSkip to skip the ticks that we dont want. Something like this:
const graduatedSkip = (v) => {
const value = Number(v.toFixed(1));
return !(
Number.isInteger(value) ||
value === graduatedMin ||
value === graduatedMax
);
};
The problem with graduatedSkip:
This works fine for displaying the ticks exactly as we want but it seems like if all the “skipped” ticks are still taken into account for positionning or something like that because when we set a range of like 0-100.1 the ticks will simply not show up even though they are mostly skipped and there are still plenty of space for them (the visible ones). here’s a codesandbox demonstrating this problem:
GoJs Knob with graduatedSkip
If you change the graduatedMax to something lower like 13.3 it will work fine but not with higher values. It also depends on the size of the widget or if it is resizable.
Our questionning:
Is it the intended behavior for the graduatedSkip or is it bugged ?
And/Or is there a better solution to our initial problem ?