Accurately Sizing Bubbles.. bug?

[arckex]

I consider this a bug with how HighCharts sizes its bubbles, which appears to be non-linear...

If you have two points on a bubble chart, with sizes 5 and 10, and set the minSize and maxSize for bubbles to be 5 and 10 it looks good. The 10 is clearly double the size of the 5. This is good.

If you add a third point with size 20 and change the chart's maxSize to 20, the middle point, 10, shrinks and no longer has a valid reference size to the other two points, i.e. it is not exactly half the size of 20 nor double the size of the 5. This is bad.

This is true if sizing with percentages or your own math and doing pixels.

I have exactly recreated this here:
https://jsfiddle.net/arckex/3kwnu69r/

[arckex]

This resizing occurs regardless of sizeBy being set to either 'width' or 'area'. In my mind, doing these resizings with 'width' should allow these bubble sizes to remain constant.

[arckex]

I still think this is a bug.

In the meantime, I found a not perfect workaround that involves setting minSize and maxSize from 0%-100%, sizing your sizeBy: 'width' not 'area', then placing two invisible bubbles on your chart: one is size 0 and the other is sized exactly the same size as your graph's yAxis.max value:

https://jsfiddle.net/arckex/2gw83yus/

[rafalS]

Hi, arckex!

In my opinion, it is not a bug. Bubble size calculations are complicated and based on many options. It is a more abstract series than most of the others and doesn't always look as we expect based on typical options. Sometimes we need to set specific options depending on the situation and what exactly we want to achieve, as you did in your 3rd post. Another workaround (I shouldn't call it a workaround) is to use zMax and zMin properties like in this fiddle: https://jsfiddle.net/BlackLabel/c3Lanerv/

You can report this on our GitHub channel to get the second opinion, but, as I said, I don't tread it as a bug and I believe that we can force this series to behave however we want using normal bubble properties from API.

Kind regards

[arckex]

I'm sure the area bubbles are valuable and generally represent data well.

But here's what I would call the bug: Sizing by width with no other options set should, by default and at least on one of the axes, scale a bubble's radius to be that graphically correct size.

A bubble size of 10 with sizeBy: 'width' and nothing else set should scale to be 10 large. That's what width means to me, and this is stopping bubble charts from accurately representing distances. I'm not sure how else you would define width.

Here's my "widths aren't widths" fiddle:
https://jsfiddle.net/arckex/jka3dfmx/

Maybe, to prevent breaking changes, you introduce a third mode 'diameter' that lets us easily graph distances in this manner.

[rafalS]

arckex,

I know what you mean. If you really consider it as a bug, please report this officially on our GitHub issues channel: https://github.com/highcharts/highcharts/issues

Best regards!