Repolode
Предложить
anvaka

anvaka/city-roads

Показывает все дороги выбранного города на одной карте, используя данные OpenStreetMap прямо в браузере.

Открыть на GitHubСайт
Звёзды
9,768
Форки
751
Открытые issues
57
Последний коммит
10 дней назад

Что это?

city-roads рисует все дороги города на одном холсте. Достаточно ввести название города: приложение загружает сегменты дорог из OpenStreetMap через Overpass API и отображает их в виде плотного линейного рисунка, который можно стилизовать и экспортировать как арт-объект.

Чтобы ускорить загрузку, проект включает кэш примерно из 3 000 городов с населением более 100 000 человек, сохранённый в простом формате protobuf. Названия городов ищутся через Nominatim: сначала приложение проверяет кэш, а если города там нет — обращается к Overpass.

Кроме того, проект предоставляет scene API для создания собственных визуализаций с помощью скриптов. Возможности рендеринга ограничены объёмом памяти браузера и GPU, поэтому очень большие регионы, например целые штаты, могут привести к сбою страницы.

Ключевые возможности

  • 01Отображает на одной визуализации все дороги города по данным OpenStreetMap
  • 02Кэширует около 3 000 крупных городов, ускоряя загрузку данных
  • 03Находит города по названиям через Nominatim
  • 04Предоставляет scene API для создания собственных визуализаций с помощью скриптов

Сценарии использования

  • Создание абстрактных постеров с картами городов или настенного декора
  • Визуальное изучение планировки улиц города
  • Создание собственных визуализаций карт с помощью scene API

Быстрый старт

  1. 1

    Установите зависимости

    npm install
  2. 2

    Запустите локальный сервер разработки с горячей перезагрузкой

    npm run dev

Что важно знать

  • Отрисовка очень больших областей может привести к сбою браузера или замедлить его работу на слабых устройствах, поскольку она зависит от объёма памяти и мощности GPU.
  • Выбор регионов с миллионами дорог, например целого штата США, может привести к сбою страницы.

Темы

#openstreetmap#data-visualization#maps#canvas#javascript#generative-art

Частые вопросы

Что такое city-roads?
Показывает все дороги выбранного города на одной карте, используя данные OpenStreetMap прямо в браузере. city-roads рисует все дороги города на одном холсте. Достаточно ввести название города: приложение загружает сегменты дорог из OpenStreetMap через Overpass API и отображает их в виде плотного линейного рисунка, который можно стилизовать и экспортировать как арт-объект.
city-roads можно использовать бесплатно? Какая у него лицензия?
city-roads распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.
city-roads всё ещё поддерживается?
Активно поддерживается. Последний коммит в city-roads — 10 окт. 2026 г..
Для чего можно использовать city-roads?
Создание абстрактных постеров с картами городов или настенного декора Визуальное изучение планировки улиц города Создание собственных визуализаций карт с помощью scene API
Как установить city-roads?
Установите зависимости: npm install Запустите локальный сервер разработки с горячей перезагрузкой: npm run dev
Где скачать city-roads?
Исходный код и инструкции по установке — на GitHub: https://github.com/anvaka/city-roads

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты