react-d3-speedometer icon indicating copy to clipboard operation
react-d3-speedometer copied to clipboard

How to add a linear gradient color to needle

Open GehanPasindhu opened this issue 2 years ago • 5 comments

I want to make a custom needle color like this and add some background. Can I do it?

image

GehanPasindhu avatar Mar 18 '23 16:03 GehanPasindhu

It is not possible right now.

In future, planned way to handle custom needle requirements is to allow user to provide custom html markup as a function like

customNeedleMarkup={() => {
   return `
     <div class="my-custom-needle">
         <svg></svg>
     </div>
   `
}}

One minor problem with this approach is custom html markup parsing might raise errors is security scanning tools. That is one of the reasons, this feature is not priotized or planned.

palerdot avatar Mar 19 '23 03:03 palerdot

To where should i pass this markup?

GehanPasindhu avatar Mar 19 '23 06:03 GehanPasindhu

To where should i pass this markup?

This is not possible right now.

It is not actively prioritized and worked on. This is an example of how things might look like if this enhancement lands sometime in the future.

palerdot avatar Mar 20 '23 03:03 palerdot

Thanks for the update.

GehanPasindhu avatar Mar 20 '23 04:03 GehanPasindhu

I'm keeping this issue open for future reference, so that new issues are not created for needle customization.

palerdot avatar Mar 21 '23 03:03 palerdot