Олександр Мацібора. Веб-ГІС якості поверхневих вод, розроблена за допомогою Node.js, Vue.js, PostgreSQL та DGGS H3

Автор
Олександр Мацібора
Опубліковано

DOI

Веб-ГІС глобальної якості поверхневих вод (GRWQ App) — веб-орієнтована геоінформаційна система, розроблена у творчій співпраці з Alexander Kmoch та Holger Virro. Це онлайн інструмент візуального аналізу і вивчення просторових даних якості поверхневих вод. GRWQ App розроблена із застосуванням всіх переваг мови JavaScript (Node.js та Vue.js) і потужності SQL (PostgreSQL).

Веб-ГІС якості поверхневих вод, розроблена за допомогою Node.js, Vue.js, PostgreSQL та DGGS H3

Основною метою розробки GRWQ App є:

  • створення веб-ГІС для візуалізації та аналізу показників якості поверхневих вод із зручним та сучасним інтерфейсом користувача;
  • проведення інженерного експерименту з ефективної інтеграції різних фреймворків, бібліотек, технологій (Node.js + PostgreSQL + Vue.js + Leaflet.js + DGGS H3) та впровадження авторської логіки в “клієнтський” застосунок

Інформація про набір даних якості поверхневих вод:

  • Virro, H., Amatulli, G., Kmoch, A., Shen, L., and Uuemaa, E.: GRQA: Global River Water Quality Archive, Earth Syst. Sci. Data, 13, 5483–5507, 10.5194/essd-13-5483-2021, 2021.

В ході розробки використовувались винятково фреймворки і бібліотеки з відкритим програмним кодом:

  • Express.js (Node.js web application framework)

  • Quasar.js (Vue.js)

  • Leaflet.js

  • DGGS H3

  • Turf.js

  • Lodash.js

Головними функціями GRWQ App є:

  • вибір досліджуваної території
  • пошук доступних пунктів спостереження за якістю води у вибраній області
  • збереження вибраних пунктів спостереження із атрибутивними даними у форматах: CSV або geoJSON
  • обчислення базових статистичних параметрів досліджуваних показників (мінімальне, максимальне, середнє арифметичне, медіана і т.п.)
  • вибір з більше ніж 40 параметрів якості поверхневих вод

Найцікавіші із технічної точки зору функції GRWQ App:

  • інтеграція Vue.js та Leaflet.js без “спільного стану” обидві бібліотеки працюють незалежно;
  • впровадження всіх переваг Composition API та сховища Pinia в Vue 3
  • імплементація DGGS (Discrete Global Grid Systems) H3

Корисні посилання: