This is my data set
{
month: "Jan",
barValue: 10,
lineData: [
{ day: "1", value: 10 },
{ day: "2", value: 15 },
// more data for Jan
],
},
{
month: "Feb",
barValue: 15,
lineData: [
{ day: "1", value: 20 },
{ day: "2", value: 25 },
// more data for Feb
],
},
// more data for other months
];
I have tried a lot of experiment using the re-charts to generate a chart like this but I am not able to. I think this is called Line chart in bar maybe? Can anyone please help me on this? I can change the data set's data structure if you want.
I tried this as well which did not work.
{data.map((entry, index) => (
<LineChart
key={`line-chart-${index}`}
width={30} // Adjust the width as needed
height={50} // Adjust the height as needed
data={entry.lineData}
margin={{ top: 0, right: 0, left: 0, bottom: 0 }}
>
<Line type="monotone" dataKey="value" stroke="#82ca9d" dot={false} />
</LineChart>
))}
</Bar>
```
Thanks in advance.
