Простой способ пагинации в Highcharts

Недавно при создании страницы статистики на сайте, мне потребовалось в очередном графике вывести 450 позиций. В виду того, что данный график бал на странице не один, да и выглядел бы очень громоздко на странице было принято решение, добавить нечто вроде разбиения данных на страницы. Для графиков в проекте используется библиотека Highcrarts. Покопавшись в документации была найдена только пагинация для легенды, но не для графиков.

Немного погуглив было найдено нерабочее решение с использованием jquery плагина Paginator и предложение подгружать данные по ajax опять же для начала сверстав кнопки. Оба решения мне не понравились поэтом я решил сделать что нибудь свое.
Немного поразмыслив, я пришел к выводу, что можно попробовать использовать для данной цели компонент Legend добавив обработчик события на элементы легенды.

Вот код результата для трех страниц

Далее несколько комментариев:
При генерации страницы значения оси для первой страницы задаются изначально:

xAxis: {     categories: [     	'Иванов К.С.',      	'Петров А.К.',      	'Сидоров О.Н.',      	'Лазарев Р.В.',      	'Ершов В.В.',      	'Никитин А.С.',      	'Смирнов Н.С.',      	'Кузнецов К.С.',      	'Соколов И.С.',      	'Попов К.Р.'     ] },

В последующем при переключении «страницы» задается в зависимости от значений в серии:

var newCats = []; for (var i = 0; i < series[this.index]['data'].length; i++) { 	newCats[i] = series[this.index]['data'][i]['name']; }; this.chart.xAxis[0].setCategories(newCats); 

Текст на кнопках легенды берется из имени серии, у всех серий кроме первой visible ставится в false.

series:      [         {         name: '1',         visible: true, 

Вот так вот, все оказалось очень просто.