react-circular-progressbar icon indicating copy to clipboard operation
react-circular-progressbar copied to clipboard

Can we have ticks around speedometer and Arrow at the end of path value.?

Open aaron170 opened this issue 5 years ago • 5 comments

🚀 Feature request

Hello.

Can we add ticks around the meter. Like we have in a Gauge chart.? And an Arrow at the path of the value.? Something like this...

Example

meter

Any help would be Appreciated. Thanks

aaron170 avatar Jun 06 '19 09:06 aaron170

The "tick marks" are actually doable - I've thrown together a codesandbox that demonstrates that here.

The arrow at the tip of the path is not possible right now. I think it could make sense in a future release to add a way to render whatever you'd like at the tip of the path, which would enable you to do that. Something along the lines of:

<CircularProgressbar renderPathEnd={({cx, cy}) => <circle cx={cx} cy={cy} r={5} />} />

kevinsqi avatar Jun 07 '19 01:06 kevinsqi

The "tick marks" are actually doable - I've thrown together a codesandbox that demonstrates that here.

The arrow at the tip of the path is not possible right now. I think it could make sense in a future release to add a way to render whatever you'd like at the tip of the path, which would enable you to do that. Something along the lines of:

<CircularProgressbar renderPathEnd={({cx, cy}) => <circle cx={cx} cy={cy} r={5} />} />

Thanks for the update Kevin..... It was helpful. I hop to see more modifications in this on future versions.

aaron170 avatar Jun 07 '19 06:06 aaron170

The "tick marks" are actually doable - I've thrown together a codesandbox that demonstrates that here.

The arrow at the tip of the path is not possible right now. I think it could make sense in a future release to add a way to render whatever you'd like at the tip of the path, which would enable you to do that. Something along the lines of:

<CircularProgressbar renderPathEnd={({cx, cy}) => <circle cx={cx} cy={cy} r={5} />} />

I'm glad someone meets the same needs as me, is this feature available right now 🤔 ?

YYCoder avatar Nov 16 '19 03:11 YYCoder

Not yet, sorry!

kevinsqi avatar Nov 19 '19 21:11 kevinsqi

Hello @kevinsqi are there any plans yet to add this functionality? I also could do with this feature...

JonnyVaine avatar Aug 27 '20 13:08 JonnyVaine