- В редакторе SVG файлов нарисуйте векторное изображение картосхемы.
- Откроте получившийся файл через редактор кода
- Получившийся код скопируйте и вставить в форму кода на портале https://highcharts.github.io/map-from-svg/
- Нажать кнопку Load и посмотреть, что получилось справа.
- Скопировать код в блокнот добавив каждому полигону следующие параметры:
- hc-code (код для карты) – это использовать в данных.
- short-name (короткое имя)
- full-name (длинное имя)
- Сохраните получившийся код в формате "*.js"
- Добавьте библиотеку получившийся файл"*.js" виджета в папку на сервер по адресу /docker-volume/dashboard-viewer/customjs
- Откройте приложение DashboardDesigner:
- На вкладке “Пользовательские виджеты”, нажмите кнопку “Создать новый”
- В открывшемся окне введи название для виджета;
- В поле “Код виджета” (JavaScript) вставьте код из файла widgets_kod.js
- Нажмите кнопку “Сохранить”
- Добавьте виджет в рабочую область
- На вкладке “Привязка данных”, привяжите данные для виджета
Важно!
Для корректного отображения информации, в данных должен существовать атрибут с гео кодом. Данный гео код должен соответствовать полю “hc-code” из файла russia_wiki.js
Важно!
Не забудьте указать название добавленного файла в пользовательских свойствах виджета.
Параметр:
"useMap": "*",
