Javascript 如何更改高图表中图表区域的背景色?

Javascript 如何更改高图表中图表区域的背景色?,javascript,highcharts,Javascript,Highcharts,我用的是Highcharts JS。我想改变线的颜色,点和线下区域的背景色 我尝试了很多方法,但都不管用。我已经在JSFIDLE上创建了一个项目,以便您可以看到 如果你有办法帮我解决这个问题,请修改代码 jsiddle上的示例: 我的代码: var chart = new Highcharts.Chart({ chart: { renderTo: 'charts', type: 'area',

我用的是Highcharts JS。我想改变线的颜色,点和线下区域的背景色

我尝试了很多方法,但都不管用。我已经在JSFIDLE上创建了一个项目,以便您可以看到 如果你有办法帮我解决这个问题,请修改代码

jsiddle上的示例:

我的代码:

var chart = new Highcharts.Chart({

            chart: {
                renderTo: 'charts',
                type: 'area',
                backgroundColor: '#4b0e26',
                style: {
                    fontFamily: 'CairoFont',
                    color: "#ffffff",
                }
            },

            xAxis: {
                categories: [
                    'يناير',
                    'فبراير',
                    'مارس',
                    'إبريل',
                    'مايو',
                    'يوليو',
                    'يونيو',
                    'أغسطس',
                    'سبتمبر',
                    'أكتوبر',
                    'نوفمبر',
                    'ديسمبر',
                ],
                reversed: true,
                lineColor: '#fff',
                tickColor: '#fff',
                labels: {
                    style: {
                        color: '#fff',
                        fontFamily: 'CairoFont'
                    }
                },
            },

            yAxis: {
                title: {
                    text: false,
                    useHTML: Highcharts.hasBidiBug,

                },
                opposite: true,
                lineColor: '#fff',
                tickColor: '#fff',
                labels: {
                    style: {
                        color: '#fff',
                        fontFamily: 'CairoFont'
                    }
                },
            },

            title: {
                text: 'الطلاب الجدد',
                useHTML: Highcharts.hasBidiBug,
                style:{
                    color: '#fff',
                }
            },

            legend: {
                enabled: false
            },

            tooltip: {
                useHTML: true,
                backgroundColor: '#FCFFC5',
                borderColor: 'black',
                borderRadius: 10,
                borderWidth: 3,

            },
            credits: {
                enabled: false
            },
            series: [{
                showInLegend: false,
                data: [
                    [0, 29.9],
                    [1, 71.5],
                    [3, 106.4],
                    [4, 300.4],
                    [5, 400.4],
                    [6, 20.4],
                    [7, 40.4],
                    [8, 120.4],
                    [9, 50.4],
                    [10, 230.4],
                    [11, 110.4],
                    [12, 500.4],
                ],

            }]

        });

如果要调整此系列的颜色,可以使用。因此,您可以将您的系列设置为:

series: [{
    showInLegend: false,
    data: [
        [0, 29.9],
        [1, 71.5],
        [3, 106.4],
        [4, 300.4],
        [5, 400.4],
        [6, 20.4],
        [7, 40.4],
        [8, 120.4],
        [9, 50.4],
        [10, 230.4],
        [11, 110.4],
        [12, 500.4],
    ],
    color: '#ff0000'
}]
从他们的文档或您的特定示例中,查看位于的工作演示


此外,您可以将其设置为全局选项,如中所述


工作演示:

所有这些说明都非常有用。我想更改线条下方突出显示区域的颜色。我怎样才能改变它@我想改变线条的颜色,点和下面区域的背景色。
Highcharts.setOptions({
    colors: ['#ff0000']
});