Skip to main content

So, pretty simple. I have a chart and it’s got data labels. According to the colors of the chart, I want the data label text to display in white. The trouble is a bit of text in skuidtheme.css that I can’t seem to be able to do anything about.

.sk-chart-standard .highcharts-data-labels tspan {
color: #000;
fill: #000;
}

There doesn’t seem to be anything I can do to affect this - it appears in the new, default themes. Setting a data label color on charts in the theme does not affect the rendering of the text. Using the Highcharts API to specify data label color does not affect the rendering of the text.

Why is this style element everpresent? Is this just something in my environment?

Thanks,

David

Having played with this some more and realizing that there are some timing issues with changes to themes, I’ve narrowed down the problem:


While I CAN specify a data label text color in the theme, I can’t specify none/null/blank. The 000 color is put in for me and I can’t seem to override this. The default behavior also overrides the Highcharts style specification which is super no-bueno.

which version of skuid?

Oof. Looks like I’m running 11.0.2. I do have an instance running Millau and I’ll give it a try sometime later today.

Horrific workaround: manually removed the offending text from the css in the static resource.

have you tried a preload snippet to set palette?

I attempted to use the highcharts method to attempt to set the color, essentially:

$.extend(true, chartObj.plotOptions,{ 
    bar: {
        dataLabels: { 
            enabled: true, 
            style:{
                color: “white”
            }
        } 
    } 
})

And it appears to set the CSS style on the text of the data label as white. Of course, the browser plows over this and implements the .sk-chart-standard .highcharts-data-labels tspan style in the skuidtheme.css applied on the parented div over the highcharts style.

Reply


View our Community Site Map

Nintex Community Sitemap
Terms & ConditionsCookie settings