Search code examples
javascriptjquerycssapexcharts

How to remove CSS fill property

I'm using JavaScript Apexcharts and it lays out bars with different colors, the problem is that I have a CSS property that overrides the fill with one single color, so now all bars have one color:

I can't access the file due to administration access but i want remove that fill property, is there a way to override or even remove it from the style

enter image description here

When i uncheck the fill property:

enter image description here

I basically want the second image, but I can't access that css stylesheet, is there a way to do it with either jQuery or JavaScript?

I tried the following but none of them work.

$('.accordion svg').style.removeProperty('fill');
$('.accordion svg').css('fill','');
$('.accordion svg').removeAttr("style");
$('.accordion svg').removeAttribute('fill');
Solution

  • You can avoid using CSS here by setting the colors property on the chartOptions/options object.

    Example:

    getChartOptions() {
    return {
        chart: {
            type: "bar",
        },
        series: [...],
        colors: ["#123456", "#234567", ...],
        ...
    }
}