javascript - Highcharts：如何更改文本和背景颜色

Question

我是 Highcharts 的新手，我正在使用一个非常简单的 Highcharts 条形图，它显示了水平堆叠的两列。我想更改背景颜色和字体颜色。该文档显示了这样的示例：

Highcharts.setOptions({
    chart: {
        style: {
            fontFamily: 'monospace',
            color: "#f00"
        }
        etc . . . 

但是 Highcharts.setOptions 对我正在使用的 javascript 代码没有帮助：

    <div id="container" style="width:100%; height:400px;"></div>

    <script>
    $(function () { 
        var myChart = Highcharts.chart('container', {
            chart: {type: 'bar'},
            title: {text: 'Chart Title'},
            xAxis: {categories: ['Category1<br>Category2']},
            yAxis: {title: {text: 'Value'}
            },

            series: [{name: 'Cat1',data: [4.2]},
            {name: 'Cat2',data: [5691.7]}]
        });
    });
    </script>

如果我只是在 yAxis 下方插入一个背景颜色指令（背景颜色：#000000），那么图形就会从屏幕上消失。

所以我的问题是如何更改上面显示的 Highcharts js 代码中的文本和背景颜色。谢谢。

标签： javascripthighcharts

Answer 1

你不能写background-color: #000000但'background-color': '#000000'或backgroundColor: '#000000'会工作

chart: {
  type: 'bar',
  backgroundColor: '#000000',
  style: {
    fontFamily: 'monospace',
    color: "#f00" // This line won't work. You must set color for each element like title, axis labels ...
  }
}

小提琴