Вы можете изменять стиль компонентов отчета и их элементов, используя пользовательские CSS-правила.

Как открыть настройки CSS

1. Перейдите в режим редактирования дашборда.
2. В верхнем левом углу нажмите «Редактировать отчет».
3. В открывшемся меню выберите CSS.

Определение селектора элемента

Чтобы определить селектор CSS элемента, воспользуйтесь инструментами разработчика браузера:

1. Откройте страницу отчета и запустите инструменты разработчика (нажатием F12, Ctrl + Shift + I или через меню Настройки → Инструменты разработчика).
2. В левом верхнем углу панели отладчика нажмите инструмент выбора элемента (пиктограмма со стрелкой).
3. Наведите курсор на нужный элемент и кликните левой кнопкой мыши. В коде HTML подсветится соответствующий элемент.

Пример стилизации диаграмм

Допустим, мы хотим изменить цвет подписей шкалы диаграмм. После выбора элемента в коде HTML можно увидеть, что он имеет класс amcharts-axis-label и содержит тег <TSPAN>.

Чтобы изменить цвет всех подписей шкалы диаграмм, добавьте в CSS:

.amcharts-axis-label > TSPAN {
    fill: #FF0000;
}

Дополнительную информацию о тегах SVG можно найти здесь: MDN SVG Elements. 

Применение стилей к конкретной диаграмме

Если нужно изменить стиль только у определенной диаграммы, найдите ее контейнер в инструментах разработчика:

1. Используйте инструмент выбора элемента.
2. Найдите ID контейнера диаграммы (например, panel_8).

   

   
3. Измените CSS-правило, добавив ID панели:

#panel_8 .amcharts-axis-label > TSPAN {
    fill: #FF0000;
}

• Для обращения к ID используйте #, а к классу ..
• Символ > указывает, что <TSPAN> является непосредственным потомком amcharts-axis-label.

Таким способом можно настраивать стили практически для любых элементов отчета. Дополнительную информацию о CSS можно найти в руководстве по основам CSS.