Closed huong-li-nguyen closed 18 hours ago
Initial results of investigation:
The decimal numbers are cut off in the input fields, if the text value has more digits than the sliders/range-sliders max
value. In the example below, range slider is defined as vm.Slider(min=1957, max=2007)
, since step
is not defined it defaults to None
. If step
is None
slider will calculate the step size, and based on the dataset in this case step
was set to 0.5.
Since selected value 1974.5 has 5 digits and max value (2007) has 4 digits, the last digit of the value in the input field will be cut-off as the max-width of the input field is dependent on the number of digits of the max
argument (adding decimal places to max
does not help).
Conclusion: The bug seems to be on Dash (as it can be replicated in a pure dash app), an issue has been raised from our side in the Dash repository: 2791
Until it has been fixed on Dash, we recommend setting the step
argument for Slider
/RangeSlider
such that the text field is not being cut-off and scales accordingly.
@maxschulz-COL - FYI for the bug you've mentioned in the last PR.
Description
Decimal numbers are sometimes being cut-off in sliders/range-sliders.
This seems to only happen when the
step
argument is not defined. When thestep
argument is defined the max-width of the input field seems to scale correctly:However, it doesn't always happen, so it doesn't seem to be a pure CSS issue as e.g. these work:![Screenshot 2024-03-12 at 10 02 11](https://github.com/mckinsey/vizro/assets/90609403/0339b8a5-0360-4402-9424-ecc1984fa749)
Expected behavior
Input field expanding to its content and not cutting of digits after the separator.
Which package?
vizro
Package version
0.1.12
Python version
3.9
OS
-
How to Reproduce
Run any example with sliders
Output
No response
Code of Conduct