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