Skip to Content

Charts Legends/Bars Color Issue while assigning 'Data Selection' on the fly to Chart


I've a simple requirement where, a user checks/unchecks multiple check-boxes and eventually data gets reflected on the chart by using .setDataSelection script.


My chart legends/bars COLOR gets changed while assigning data on the fly.

To explain better please relate below scenario's with attached screenshots.

Scenario: with TWO KF's scenario-two-fks.png

KF's Internal Cost(Labour_1) - Brown (some data)

KF's Outsourced Cost(Labour_2) - Green (no data - blank)

Now, Scenario with THREE KF's (Issue with colors) scenario-three-fks.png

setDataSelection on the fly....

KF's Internal Cost(Labour_1) - Blue (some data)

KF's Internal Cost(Material_1) - Green(some data)

KF's Outsourced Cost(Labour_2) - Yellow (no data - blank)

Possible workaround with limitations ??

set below css to graph, but the challenge is, if i can set css to specific KF's. Not sure if we can do that, as the below code will apply to all KF's.


Highly appreciate your suggestions.



Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

1 Answer

  • Nov 01, 2016 at 08:03 PM

    Updating the thread with some progress on my end.

    My thought so far: It pretty much looks like a BUG to me.

    How to fix it?
    Use CSS that will over-write the default color code from chart-properties.

    Code for LINE chart -

    .my_chart g.v-m-main g.v-m-plot g.v-axis1 .v-lines.v-morphable-line:nth-child(1) {Stroke: #5A0000;}

    (my_chart = css class (you can change this to anything and call/Set this in your chart properties)


    Not sure what code I should use to overwrite data-points (like I want then Black)

    Any suggestions on that will be highly appreciated, thanks

    LineChart with CCS code


    Add comment
    10|10000 characters needed characters exceeded