Skip to Content
0

CSS Column Chart 2 measure values

Mar 03 at 04:58 AM

56

avatar image

Hi,

I am trying to overwrite default color of Column-bars using css. Chart with a single measure value is working for me using below css.

.set1 g.v-m-main g.v-m-plot g.v-plot-main g.v-datapoint-group .v-datapoint:nth-child(2) rect {fill: black;}

Now, i have a chart with 2 measure value and the above code is impacting both the measure bar as i believe i'm not refining measure 'child' value. I want to handle both measures independently with css.

After debugging using F12 i kind of ran into a wall. I did found related post but still no luck.

PFA. bar-chart-2measure.png

Appreciate you advice.

Regards,

Fahad

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

Best Answer
Arijit Das Mar 06 at 06:20 AM
0

Can you try this way:

.myChart .v-datapoint-group>g:nth-child(1)>g>rect{
	fill: black;
}
.myChart .v-datapoint-group>g:nth-child(2)>g>rect{
	fill: white;
}
.myChart .viz-legend-valueLabel>g:nth-child(1)>path{
	fill: black;
}
.myChart .viz-legend-valueLabel>g:nth-child(2)>path{
	fill: white;
}
Show 1 Share
10 |10000 characters needed characters left characters exceeded

Thanks Arijit that worked like a charm

0