option to force scales of bar charts on left and top to the same sizes about upsetjs HOT 7 CLOSED

i found heightRatios but i can't for the life of me figure out how to compute ratios that fix this problem. i tried this:

computeChartHeightRatios = (
  sets,
  minCombinations = 2,
) => {
  const leftMax = d3.max(sets, d => d.cardinality);
  const topMax = d3.max(
    UpSetJS.generateCombinations(sets)
      .filter(d => d.sets.size >= minCombinations)
      .map(d => d.cardinality)
  );
  const ratio = (topMax / leftMax);
  return [ratio, 1 - ratio];
}

and many many different versions of this. even if i drop in magic numbers, they don't work as soon as the chart height changes. sadly for my uses case i can't really use the chart without aligning these scales. :\

from upsetjs.

can you create a sketch of what you wanna achieve and how it relates to the chart dimension

from upsetjs.

sure!

i need to ensure that distance A (0 to 5 on "Set Size" scale) is the exact same number of pixels as distance B (0 to 5 on the "Intersection Size" scale).

from upsetjs.

isn't it in the end just enforcing special ratios or setting the width/height such that the constraint:

(width - padding*2) * wRatio == (height - padding*2) * hRatio

is fulfilled

e.g., https://codepen.io/sgratzl/pen/MWeVBKg?editors=0010

from upsetjs.

so yes you have solved this problem for one static case. i don't know where you got the values for:

  const widthRatios = [0.18, 0.12, 0.7];
  const heightRatios = [0.6, 0.4];

and i don't know how i would figure any of this out from the documentation.

but all of that aside, this is a fundamental data visualization issue. surely you get that?

i'll see if i can generalize your solution and plug it into my code, but gosh it seems like having this logic built in would make sense.

from upsetjs.

v1.7.0 allows to specify both the maximal scale value as well as the precise pixel values for the set/combination areas. Thus, with e.g.

https://codepen.io/sgratzl/pen/PoGbLOz?editors=0010

from upsetjs.

this is really great! thank you! 🙏🏻

from upsetjs.