Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sergeiown/map_with_marker_clusters
This application is designed to visualize markers on a map using the Leaflet library and group them using Leaflet.markercluster. The application is designed to display the location of companies on the map with the ability to group markers into clusters.
https://github.com/sergeiown/map_with_marker_clusters
javascript leaflet map openstreetmap ukraine
Last synced: 5 days ago
JSON representation
This application is designed to visualize markers on a map using the Leaflet library and group them using Leaflet.markercluster. The application is designed to display the location of companies on the map with the ability to group markers into clusters.
- Host: GitHub
- URL: https://github.com/sergeiown/map_with_marker_clusters
- Owner: sergeiown
- License: mit
- Created: 2023-12-15T19:33:08.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-04-07T16:22:49.000Z (9 months ago)
- Last Synced: 2024-04-08T13:45:17.105Z (9 months ago)
- Topics: javascript, leaflet, map, openstreetmap, ukraine
- Language: JavaScript
- Homepage: https://sergeiown.github.io/Map_with_Marker_Clusters/
- Size: 2.54 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README-UA.md
- License: LICENSE
Awesome Lists containing this project
README
# "Map with Marker Clusters"
[EN](https://github.com/sergeiown/Map_with_Marker_Clusters/blob/main/README.md) | **[UA](https://github.com/sergeiown/Map_with_Marker_Clusters/blob/main/README-UA.md)**
## Огляд
Застосунок призначений для відображення розташування компаній зрозумілим користувачу способом на мапі з можливістю групування створених маркерів у кластери. Доступні різні варіанти відображення шарів карти та додаткові опції.
| Структура: ||
| --- | --- |
| Залежності | ![image](https://github.com/sergeiown/Map_with_Marker_Clusters/assets/112722061/c95d7dcb-59e3-40f3-9e30-7e5b32e5ca45) || Зовнішній вигляд: ||
| --- | --- |
| ![image](https://github.com/sergeiown/Map_with_Marker_Clusters/assets/112722061/769807b7-57f3-41aa-b614-2a87e16703a9) | ![image](https://github.com/sergeiown/Map_with_Marker_Clusters/assets/112722061/3adc1b46-b44a-466f-bc08-837f902631f2) || Зовнішній вигляд (мобільна версія): ||
| --- | --- |
| ![image](https://github.com/sergeiown/Map_with_Marker_Clusters/assets/112722061/475202b8-0cd5-40e9-97a0-72f13a407ad3) | ![image](https://github.com/sergeiown/Map_with_Marker_Clusters/assets/112722061/60b9c8c9-be71-4085-89e2-e658960cff35) |
| Портретний | Альбомний |## Технічні засоби та бібліотеки
Використано наступні додаткові бібліотеки:
1. **Leaflet**: JavaScript-бібліотека для інтерактивних карт.
- [Leaflet Documentation](https://leafletjs.com/)
2. **Leaflet.markercluster**: Розширення для Leaflet, яке надає можливість групування маркерів у кластери для покращення ефективності відображення на мапі.
- [Leaflet.markercluster Documentation](https://github.com/Leaflet/Leaflet.markercluster)
3. **geoBoundaries Global Database**: База даних політичних адміністративних кордонів з відкритою ліцензією, стандартизований ресурс кордонів для кожної країни у світі.
- [geoBoundaries Global Database](https://www.geoboundaries.org)Бібліотеки інтегровано у проєкт додаткового встановлення не потрібно.
## Встановлення та запуск
1. Завантажте проєкт з репозиторію.
2. Відкрийте HTML-файл у вашому веб-браузері або використовуйте локальний сервер для запуску.## Конфігурація та Дані
1. **Мапа**: Координати та параметри мапи налаштовуються у `L.map('map').setView([49.0, 31.0], 6);` у файлі `map.js`.
2. **Маркери**: Дані про компанії завантажуються з файлу `companies.json` та використовуються для розміщення маркерів на мапі. Маркери зберігаються у папці `markers`.
3. **Кластери**: Кластеризація маркерів реалізована за допомогою `Leaflet.markercluster`.
4. **Легенда**: Дані легенди завантажуються з файлу `legend.json`. Маркери зберігаються у папці `markers`.## Додаткові Геодані
1. **Державні кордони України**: Геодані для кордонів України завантажуються з файлу `geoBoundariesGeneral.geojson`.
2. **Обласні кордони**: Геодані для областей України завантажуються з файлу `geoBoundariesSimplified.geojson`.
3. **Межі районів**: Геодані для районів України завантажуються з файлу `geoBoundariesDetailed.geojson`.## Завдання для Майбутнього Розвитку
1. **Додавання Інтерактивності**: Розглядаю можливість додавання додаткової інтерактивності для маркерів або додаткових шарів на мапі.
## Ліцензія
[Copyright (c) 2023-2024 Serhii I. Myshko](https://github.com/sergeiown/Map_with_Marker_Clusters/blob/main/LICENSE)