Wrong placement for elements with negative number

[shinspiegel]

Description

It appears that some calculation for the position breaks if there are values with a negative number. In special if we have marks defined. With multiple buttons, some of them also break.

CodeSandbox

Minimum Example

[kris-ellery]

react-slider does not support negative values. We would need to add it as a new feature.

[axelboc]

Best way is to set the min/max/step of the slider to whole integer numbers, say 0 to 100 with a step of 1, and then use a scale (e.g. d3-scale's linear scale) to go from your negative domain to the range of the slider and back. You can write a small wrapper component to abstract this complexity away.