plotly.js icon indicating copy to clipboard operation
plotly.js copied to clipboard

not support extremely small number

Open missBlueWhite opened this issue 6 months ago • 6 comments

When my normalized color scheme values are extremely small (down to 5 decimal places), this configuration becomes invalid. Image

Image

missBlueWhite avatar May 27 '25 07:05 missBlueWhite

thanks for the bug report @missBlueWhite - when you say "becomes invalid", what error message are you seeing? and which version of plotly.js are you using? thanks - @gvwilson

gvwilson avatar May 28 '25 12:05 gvwilson

I'm guessing you're creating a heatmap and/or a heatmap-colored contour map. In these modes I believe we convert the colormap to 256 discrete colors, so the way you're generating your colormap all of these except the final color get collapsed into one.

The standard way to use colormaps is to scale the values up so that instead of 0-0.00009 you use the full 0-1 range, then map these to your data using the zmin and zmax attributes (or cmin and cmax in some contexts). Note that the strategy you used here would throw an error if you tried to use it with data outside the 0-1 range.

alexcjohnson avatar May 28 '25 16:05 alexcjohnson

感谢您的错误报告 - 当您说“变得无效”时,您看到的是什么错误消息?您使用的是哪个版本的 plotly.js?谢谢-

Image As shown in the figure, the image contains only two colors: red and purple, while the other colors are not displayed. The z-values provided range from 200 to 3,000,000. When setting the colorScale as described above, only purple and red appear, and the other colors fail to render.

TBusan avatar May 30 '25 06:05 TBusan

@TBusan right, in principle this is a bug that at some point we should fix, but I suspect doing that would be a substantial project that might also impact performance, so it's much better to make use of the existing patterns if you can use them to do what you need.

The colorscale screenshot posted by @missBlueWhite is a linear mapping of 20 colors over the first ten-thousandth of the range, then everything above that is purple. That's exactly what zmin and zmax are for. To use this pattern, multiply all the fractions in your colorscale except the 1 at the end by 10000 (so instead of 0.00009595... use 0.9595...) and then set bounds like zmin=200, zmax=500 (ie zmin is your data minimum, and zmax is one ten-thousandth of the full range 200 + (3e6-200)/1e4)

alexcjohnson avatar May 31 '25 02:05 alexcjohnson

@TBusan right, in principle this is a bug that at some point we should fix, but I suspect doing that would be a substantial project that might also impact performance, so it's much better to make use of the existing patterns if you can use them to do what you need.

The colorscale screenshot posted by @missBlueWhite is a linear mapping of 20 colors over the first ten-thousandth of the range, then everything above that is purple. That's exactly what zmin and zmax are for. To use this pattern, multiply all the fractions in your colorscale except the 1 at the end by 10000 (so instead of 0.00009595... use 0.9595...) and then set bounds like zmin=200, zmax=500 (ie zmin is your data minimum, and zmax is one ten-thousandth of the full range 200 + (3e6-200)/1e4)

thanks, but nn some cases, I don't want to use the zmin or zmax ,I want to render all of the data.

missBlueWhite avatar Jun 06 '25 01:06 missBlueWhite

With zmin and zmax we still render all the data, but anything below zmin gets the min color and anything above zmax gets the max color. You're right that there are situations that this won't cover (a common one we'd like to support at some point, though I'm not seeing an issue for it ATM, is logarithmic colorscales), but it would work for the example you started this issue with, in which all the data from 0.000095 to 1 is already mapped to the same color.

alexcjohnson avatar Jun 06 '25 02:06 alexcjohnson