Оформление
Свой код
Тип Свой код рисует виджет вашей разметкой, стилями и скриптом. Платформа делает выборку по полям на осях, как для любого виджета, и передаёт строки вашему коду, а тот строит из них что угодно: карточку в фирменном стиле, нестандартную диаграмму, таблицу с особой подсветкой.
Когда брать. Ни один из готовых типов не подходит, а в команде есть человек, который пишет на HTML и JavaScript. Для обычных графиков готовые типы удобнее: у них есть настройки оформления, форматы и выделение без строчки кода.
| Категория | Серии | Мера |
|---|---|---|
| сколько угодно | сколько угодно | сколько угодно |
Как собрать виджет
- Создайте виджет на датасете и выберите в панели справа Тип виджета → Свой код.
- Разложите поля по осям, как для таблицы: измерения — в Категорию или Серии, показатели — в Меру. Поля всех трёх осей придут в код одним списком
data.fields, а их значения — ключами каждой строки. - В секции Код нажмите Редактировать код….
- Напишите код в панелях HTML, CSS и JS. Справа Предпросмотр сразу показывает результат на текущей выборке виджета.
- Нажмите Сохранить в окне кода, затем Сохранить у виджета.

Новый виджет открывается с рабочим примером: он выводит каждую строку выборки через «—». Кнопка Справка в окне перечисляет всё, что доступно коду, с примерами.
Что получает код
Скрипт исполняется после того, как разметка вставлена в виджет. Выборка лежит в объекте data, а платформа доступна через объект dw.
| Обращение | Что даёт |
|---|---|
data.rows | Строки выборки с сырыми значениями: ключ — id поля, значение — число, строка или null |
data.formatted | Те же строки, но значения уже в формате поля: «840 000,00», «01.03.2026» |
data.fields | Поля выборки: id, alias — подпись поля, sql — формула, primitiveType — тип |
data.page | Сведения о постраничной выборке; hasMore — строк больше, чем пришло |
dw.on('data', fn) | Новая выборка — после смены фильтров дашборда или обновления |
dw.refresh() | Перезапросить данные |
Остальные возможности — выбор значения для связанных виджетов, свои фильтры выборки, тема оформления и размеры плитки — описаны в Справке окна.
Пример: итог по мере, собранный из строк по категориям. Разметка — <div class="total"></div>.
js
const measure = data.fields.find((f) => f.alias === 'SUM(amount)');
const cat = data.fields.find((f) => f.alias === 'category');
function render(data) {
const byCat = {};
for (const row of data.rows) {
byCat[row[cat.id]] = (byCat[row[cat.id]] ?? 0) + (row[measure.id] ?? 0);
}
const total = Object.values(byCat).reduce((a, b) => a + b, 0);
document.querySelector('.total').textContent = 'Итого: ' + total.toLocaleString('ru-RU');
}
render(data);
dw.on('data', render);Ищите поля по подписи, а не по роли
Справка предлагает отличать измерения от мер по полю role, но надёжно это работает только для полей, положенных на оси мышью. У виджета, собранного запросом к API или помощником, и у старых виджетов, переключённых на этот тип, все поля приходят с ролью measure — включая текстовые. Находите нужное поле по alias или по primitiveType.
alias — подпись поля на полке. Переименовали поле в редакторе виджета — поправьте и строку поиска в коде, иначе поле не найдётся.
Виджет со своим кодом работает везде, где работают остальные: на дашборде, в выгрузке в файл и в рассылке.
Изоляция кода
Код исполняется в изолированном фрейме. Он не видит страницу платформы, её cookie и хранилище браузера: попытка прочитать document.cookie, localStorage или страницу-родителя заканчивается ошибкой SecurityError. Войти от имени пользователя или прочитать чужие данные такой код не может — он получает только выборку своего виджета.
Код может отправлять данные наружу
Сетевые запросы из фрейма не ограничены. Код может подключить библиотеку с внешнего адреса — например, import('https://cdn.jsdelivr.net/npm/…') — и так же может отправить выборку на любой сервер. Выборка считается по правам того, кто открыл дашборд, поэтому такой виджет передаст наружу данные каждого, кто его открыл. Создавать виджеты может любой пользователь, кроме наблюдателя; если это недопустимо, проверяйте код виджетов этого типа перед публикацией.
Администратор может вынести фрейм на отдельный адрес переменной окружения SANDBOX_HOST: тогда у кода свой origin. Изоляция от платформы при этом та же.
Помощник
Кнопка AI-помощник в окне кода открывает диалог: опишите словами, что нарисовать, и помощник заменит содержимое трёх панелей. Он видит текущий код, поля выборки и справку. Работает, если администратор подключил AI-провайдера.
Что дальше
- Типы виджетов — сначала проверьте, нет ли готового типа.
- Поля, фильтры и сортировка — как собрать выборку для кода.
- Помощник — остальные возможности AI в платформе.