BarChart.tsx•1.26 kB
import React from "react"
import {
VictoryAxis,
VictoryBar,
VictoryChart,
VictoryGroup,
VictoryTheme,
} from "victory"
export default function BarChart(props: { rows: any[]; headers: string[] }) {
const { rows, headers } = props
const x = headers[0]
const ys = headers.slice(1)
return (
<VictoryChart theme={VictoryTheme.clean}>
<VictoryAxis
style={{
tickLabels: {
angle: 45,
textAnchor: "start",
padding: 5,
},
}}
/>
<VictoryGroup offset={20} style={{ data: { width: 15 } }}>
<VictoryAxis dependentAxis />
{ys.map((y) => (
<VictoryBar
key={y}
data={rows
.filter((row) => row[y])
.map((row) => ({
x: row[x],
y: row[y],
}))}
labels={({ datum }) => datum.y}
/>
))}
</VictoryGroup>
</VictoryChart>
)
}