Настройка градиентной заливки фона диаграммы

Для диаграмм HighCharts добавлена возможность установки угла и прозрачности линейного градиента, установленного в качестве фона диаграммы или области построения диаграммы.

Для выполнения примера создайте диаграмму, как показано в примере на странице «Размещение диаграммы Highcharts на html-странице». В атрибут chart добавьте следующие настройки:

                backgroundColor: {
                    linearGradient: {
                        angle: 90,
                        opacity: 0.5
                    },
                    stops: [
                        [0, 'rgb(255, 105, 180)'],
                        [1, 'rgb(72, 209, 204)']
                    ]
                },
                plotBackgroundColor: {
                    linearGradient: {
                        angle: 30,
                        opacity: 0.7
                    },
                    stops: [
                        [0, 'rgb(173, 216, 230)'],
                        [1, 'rgb(70, 130, 180)']
                    ]
                }

После выполнения примера для диаграммы и области построения диаграммы будет применена заливка в виде линейного градиента с углом градиента соответственно 90 и 30 градусов:

См. также:

Доработки HighCharts | Примеры | Элемент chart