javascript - 使用 CSS 设置 Highcharts 颜色主题

Question

我正在为包括 Highcharts 在内的仪表板设置动态主题。目标是根据为特定用户设置的主题更改图表颜色。

我为此提出了一个可行的解决方案，但这仅适用于本地主机。如果 CSS 文件位于远程服务器上，则不起作用。

function getStyle(className) {
    var cssFileName = 'chart_theme_1.css';
    styleSheetsCount = document.styleSheets.length;
    for(j = 0; j < styleSheetsCount ; j++){
    var href = document.styleSheets[j].href;
    var a = href.split('/');
    if(a[a.length -1] == cssFileName){
        classes = document.styleSheets[j].rules || document.styleSheets[j].cssRules;
        break;
    }
    }

    for (var x = 0; x < classes.length; x++) {
        if (classes[x].selectorText == className) {
            return classes[x].style.color ; 
        }
    }
}

$(document).ready(function(){
    colors =  [];    
    for (var i = 1; i < 8; i++) {
    colors.push(getStyle('.highChartsColor'+i));
    }
    Highcharts.setOptions({
        colors: colors,
        style: {
            fontFamily: 'Arial'
        }
    });
});

Answer 1

请确保您提供了正确的 .css 文件路径。

可能是:/var/www/html/<.folder name>/<.css file>

请检查您的 css 文件路径。