Skip to Content
0

CSS for Column Chart with 3 measures

Nov 08, 2016 at 01:15 AM

49

avatar image

I want the following three bars to have different border and fill colours.

Each bar is a different measure:

Currently all three bars are being impacted by the following CSS Class

.myBar g.v-m-main g.v-m-plot g.v-plot-main g.v-datapoint-group .v-datapoint:nth-child(2) rect

{

fill:white;

stroke:#cb6015;

}

How do I differentiate between the three measure bars using CSS class groups?

I’ve spent a lot time trying to work out the class groups using F12 in Internet Explorer, and reading other posts …but no joy.

Design Studio 1.6 SP1

Thanks in advance.

Greg

bar-chart.png (1.7 kB)
data-source.png (12.0 kB)
10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

2 Answers

jing zhang Nov 08, 2016 at 01:57 AM
0

maby you can run it in fox browser,then you can find the id or class of the three bars .

fox is better than IE in this.

Share
10 |10000 characters needed characters left characters exceeded
Poovarasan Boopalan Nov 08, 2016 at 07:39 AM
0

Hi Greg,

Use the below CSS to change the border and color as needed.

.bar rect[fill="#800000"]

{ stroke-width:5px;

stroke: yellow ;

stroke-dasharray:3px;

fill: blue;

}

In the square bracket, give the hex value of color of the bar you need to change.

Thanks,

Poovarasan

Share
10 |10000 characters needed characters left characters exceeded