FormidableLabs / FormidableLabs/victory
Animate prop causes VictoryTooltip to change color names to rgb strings
- Dominant language
- TypeScript
- Stars
- 11.2k
- Forks
- 536
- PR merge metrics
- No merged PRs in 30d
Description
**Describe the bug**
I have a `` chart where each point displays a tooltip with the `label` associated with that point, like so: ` datum.label}`. If I add an `animate` prop to the `` holding my scatterplot then any point with a `label` matching a [CSS color name](https://www.w3schools.com/cssref/css_colors.asp) will have its tooltip show the rgb string of that color instead of the actual label string. For example, if a point has the `label` "[Tomato](https://www.w3schools.com/colors/color_tryit.asp?color=Tomato)", then adding the `animate` prop causes the tooltip for that point to display "rgb(255, 99, 71)".
**Victory version**
Victory 36.2.0
**Code Sandbox link**
[Sandbox link](https://codesandbox.io/s/victorytooltip-text-color-names-bu2rym?file=/index.js:365-381)
**To Reproduce**
1. Visit the sandbox link above
2. Hover over each point. Notice that each point with a `label` set to a CSS color name will have a tooltip showing an rgb string
3. Remove the `animate` prop from the ``
4. Hover over each point again. Notice that labels with color name labels are no longer changed to rgb strings
Contributor guide
Assessment
This issue has not been assessed yet.