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
So i used indexBy proprty for barchart using this data label. I want color for specify label value if label=jan color shoud red if label=Feb color should green. How i customise color for my data label
The text was updated successfully, but these errors were encountered:
This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!
@gowsi-03, I'm going to close this issue for now, as it's really difficult to understand without formatting the code, please feel free to edit the issue and comment if you can provide an example and cleanup the description a bit.
Hi,
I Was just wondering if there is a way to set a color to a bar in a ResponsiveBar chart
For example:
import { type BarDatum } from '@nivo/bar'
const chartData: BarDatum[] = [
{
label: 'Jan',
value: 40,
},
{
label: 'Feb',
value: 60,
},
]
export default chartData
import { Meta, StoryObj } from '@storybook/react'
import { BarChart } from '@/components'
import chartData from './chartData'
const meta: Meta = {
title: 'BarChart',
component: BarChart,
}
export default meta
type Story = StoryObj
export const Default: Story = {
name: '[0] default',
render: (args) => (
<BarChart {...args} data={chartData} />
),
}
import { type BarDatum, ResponsiveBar } from '@nivo/bar'
export interface Props {
className?: string
classNames?: { wrapper?: string }
data: BarDatum[]
indexBy: string
enableLabel: boolean
isInteractive: boolean
}
const BarChart = ({
data,
indexBy = 'label',
enableLabel = false,
isInteractive = false,
}: Props) => {
return (
<ResponsiveBar
data={data}
keys={['value']}
indexBy={indexBy}
colors={(d) => d.data.color}
/>
)
}
export default BarChart
So i used indexBy proprty for barchart using this data label. I want color for specify label value if label=jan color shoud red if label=Feb color should green. How i customise color for my data label
The text was updated successfully, but these errors were encountered: