JSFiddle - React, Tailwind, and code Playground
by Ilya Ivanov
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="width: 1200px; height: 1000px; margin: 0 auto"></div>
JavaScript
$(function () {
var colors = Highcharts.getOptions().colors,
categories = ['Образование', 'Экономика', 'Общегосударственные вопросы', 'Здравоохранение', 'Соцполитика', 'Межбюджетные трансферы', 'ЖКХ', 'Культура', 'СМИ', 'Национальная безопасность', 'Спорт', 'Охрана окружающей среды', 'Госдолг', 'Национальная оборона'],
data = [{
y: 20.44,
color: colors[0],
drilldown: {
name: 'Статьи <Образование>',
categories: ['Общее', 'Среднее профессиональное', 'Повышение квалификации', 'Высшее и послевузовское', 'Молодежная политика', 'Программа "Развитие образования и науки Республики Татарстан на 2014–2020 годы"'],
data: [1.73, 2.44, 0.14, 0.13, 0.93, 15.07],
color: colors[0]
}
}, {
y: 18.97,
color: colors[1],
drilldown: {
name: 'Статьи <Экономика>',
categories: ['Общеэкономические вопросы', 'Воспроизводство минерально-сырьевой базы', 'Сельское хозяйство и рыболовство', 'Водное хозяйство', 'Лесное хозяйство', 'Транспорт', 'Дорожное хозяйство', 'Связь и информатика', 'Противодействие преступности', 'Безопасность дорожного движения'],
data: [0.47, 0.03, 4.91, 0.02, 0.44, 1.80, 8.33, 0.73, 1.03, 0.95],
color: colors[1]
}
}, {
y: 16.65,
color: colors[2],
drilldown: {
name: 'Статьи <Общегосударственные вопросы>',
categories: ['Функционирование высшего должностного лица субъекта Российской Федерации и муниципального образования', 'Функционирование законодательных (представительных) органов государственной власти и представительных органов муниципальных образований', 'Функционирование Правительства Российской Федерации, высших исполнительных органов государственной власти субъектов Российской Федерации, местных администраций', 'Судебная система',...