palerdot / react-d3-speedometer

React Speedometer component using d3.js ⚛️
https://palerdot.in/react-d3-speedometer/
MIT License
230 stars 57 forks source link

Possible to make needle stop at max value? #171

Open raukaute opened 1 year ago

raukaute commented 1 year ago

Hey,

I was wondering if it's possible to to prevent the needle going beyond the max-value?

Cheers!

palerdot commented 1 year ago

I don't understand. Please post a screenshot of what you are referring to.

raukaute commented 1 year ago

Sorry for the confusion. What is the maxValue used for, if the needle will never actually stop, i.e. is prevented from going beyond that value? I hope I could make my point a bit clearer. 🙈

image

palerdot commented 1 year ago

Ok. I think you should validate your value and check if it is within your range, since you are controlling the value and maxValue.

For some use cases, current behaviour may be relevant, like animating a value going out of range slightly (for eg: a speedometer showing revving of engine, which crosses the threshold). I think in general, you should control the value being animated and not just directly inject the value directly to the speedometer. For eg: passing a string as a value, will show NaN and animate to the middle. The library leaves these scenarios for the consumers to handle. I hope it makes sense.