Для того чтобы изменить внешний вид таблицы(Или любого другого графика) в bi аналитике, необходимо перейти в режим редактирования Дашборда.
Далее необходимо нажать на 3 точки и выбрать “Редактировать CSS”. Выйдет окно, где можно прописать все необходимые стили которые будут применимы к конкретному дашборду.
Примеры того как можно использовать свой CSS
1. Для того чтобы стиль не относился к нескольким таблицам, если они есть в вашем дашборде, то необходимо открыть панель разработчика и найти “id” у “<div>”, внутри которого находится таблица. Это позволит обращаться к конкретной таблице
2. Скрытие лишних строк (В примере скрывается системная строка, которая не нужна заказчику, но ее нельзя убрать стандартным функционалом)
#chart-id-925 thead tr:nth-child(1) th {
border-bottom: 1px solid rgb(224, 224, 224);
}
#chart-id-925 thead tr:nth-child(2) {
display: none;
}
Разберем по какой логике работает стиль:
- #chart-id-925 - Айди <div> в котором находится таблица, получили его из шага 1.
- thead - Обращаемся только к заголовку таблицы, чтобы изменения не применились к строкам.
- tr:nth-child(1/2) - Обращаемся к первой и второй строкам таблицы соответственно, чтобы изменения не касались других строк в заголовке, если они есть. Вторая строка - Мера, стандартная строка которая добавляется в сводной таблице, ее и нужно убрать.
(Было)
(Стало)
3. Закрепление столбца таблицы на месте при прокрутке (В примере закрепляется первый столбец и название)
#chart-id-923 tr td:first-child,
#chart-id-923 thead tr:first-child th:first-child {
position: sticky;
left: 0;
z-index: 10;
background-color: white;
}
Разберем по какой логике работает стиль:
- #chart-id-925 - Айди <div> в котором находится таблица, получили его из шага 1.
- tr td:first-child - Выбор всех первых столбцов в строках
- thead tr:first-child th:first-child - Выбор названия первой колонки
(Было: первый столбец прокрутился)
(Стало: первый столбец закреплен)
