You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hi, I would like your help to achieve some things with the "visx/xychart" package version 2.18.
On an "AnimatedBarGroup," I want to display an annotation of the y value above each bar series. I would also like to customize each bar's fill color versus the stroke color. Is it possible?
Here is the code: [...]<AnimatedBarGroup> <BarSeries data={data} xAccessor={accessors.xAccessor} yAccessor={accessors.y2Accessor} colorAccessor={() => "yellow"} /> <BarSeries data={data} xAccessor={accessors.xAccessor} yAccessor={accessors.y1Accessor} colorAccessor={() => "purple"} // only changes the fill color /> </AnimatedBarGroup>[...]
Here is the result I would like to obtain, ideally without having to use CSS classes unless no props are available for this:
On an "AnimatedAreaStack," I would like to display the circled data points when the tooltip reaches a value as I did with "AnimatedAreaSeries" by using the following props: "snapTooltipToDatumX, snapTooltipToDatumY, showVerticalCrosshair, and showSeriesGlyphs." Is it possible to obtain the same result?
Here is how it looks on "AnimatedAreaSeries":
Here is how it looks on "AnimatedAreaStack":
Is it possible to make it look like the "AnimatedAreaSeries" case on each series? It seems like it's not showing with the same props on "AnimatedAreaStack".
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
Hi, I would like your help to achieve some things with the "visx/xychart" package version 2.18.
Here is the code:
[...]<AnimatedBarGroup> <BarSeries data={data} xAccessor={accessors.xAccessor} yAccessor={accessors.y2Accessor} colorAccessor={() => "yellow"} /> <BarSeries data={data} xAccessor={accessors.xAccessor} yAccessor={accessors.y1Accessor} colorAccessor={() => "purple"} // only changes the fill color /> </AnimatedBarGroup>[...]
Here is the result I would like to obtain, ideally without having to use CSS classes unless no props are available for this:
Here is how it looks on "AnimatedAreaSeries":
Here is how it looks on "AnimatedAreaStack":
Is it possible to make it look like the "AnimatedAreaSeries" case on each series? It seems like it's not showing with the same props on "AnimatedAreaStack".
Thanks a lot for your help
Beta Was this translation helpful? Give feedback.
All reactions