Пользовательский виджет "Картосхема"

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

Важно!

Для корректного отображения информации, в данных должен существовать атрибут с гео кодом. Данный гео код должен соответствовать полю “hc-code” из файла russia_wiki.js


Важно!

Не забудьте указать название добавленного файла в пользовательских свойствах виджета.

Параметр:

"useMap": "*",

  Файл Изменено

Файл JavaScript widgets_kod.js ??? ??? ???????

дек. 28, 2020 by Visiology Robot