mercredi 24 février 2021

Custom Label and Bar background colour in Recharts

I am new to Recharts and SVG and looking for some help trying to match the design below using Recharts.

Colors: #003C88, #003C8840, #7F7F7F, #D9D9D9

enter image description here

Here is https://codesandbox.io/s/recharts-barchart-forked-7sl6x?file=/index.js is what I have done so far to try to create the two stripe patterns in the design for the bar and to have a custom red / green label at the base of the two bars per month. As you can see both the background bar patterns are not the expected solid colours but have some opacity < 1 affecting them. So instead of the dark blue I get a light blue background colour. The patterns are also coming through the red / green labels I have at the base of the bars. How can I get the pattern background display without the opacity level of < 1. AND how would I ensure the red/green labels are not showing the patterns behind them?

Aucun commentaire:

Enregistrer un commentaire