使用CSS设置Highcharts颜色主题

问题描述：

我正在为包括Highcharts的仪表板设置动态主题设置。目标是根据为特定用户设置的主题更改图表颜色。使用CSS设置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' 
     } 
    }); 
});

您是通过调试器来查看是否正确获取样式表？ – raduation

是的。当我使用调试器检查时，href（'document.stylesheet [j]）'是正确的。但是，'rules'和'cssRules'设置为'undefined' – Karthik

你可以jsfiddle，http://jsfiddle.net – dreamweiver

答

请确定您正在给出正确的.css文件路径。

它可能是：在/ var/www/html等/ < .folder名称>/< .css文件>

请检查你的CSS文件的路径。

您能否详细说明您的答案，并添加关于您提供的解决方案的更多描述？ – abarisone

使用CSS设置Highcharts颜色主题

相关推荐