Moveet: 실제 도로 네트워크와 실시간 교통을 활용한 도시 비특정 플릿 시뮬레이터 구축

발행: (2026년 3월 19일 PM 08:06 GMT+9)
6 분 소요
원문: Dev.to

Source: Dev.to

개요

Moveet는 TypeScript로 구축된 오픈‑소스 실시간 차량 플릿 시뮬레이터입니다. 실제 도로 네트워크에서 차량을 운행하며 A* 경로 탐색, 현실적인 교통 모델링, 그리고 맞춤형 D3‑기반 지도 렌더러를 사용합니다 — Leaflet도, Mapbox도, 타일 제공자도 없습니다.

최신 릴리스에서는 시뮬레이터가 완전히 도시‑독립적으로 바뀌었습니다. 원하는 도시를 지정하면 OpenStreetMap 데이터에서 경로 가능한 그래프를 구축하고, 혼잡 모델링, 지오펜싱, 실시간 교통 오버레이를 모두 포함합니다.

From OSM Data to a Routable Graph

A CLI pipeline (apps/network) handles the full OpenStreetMap ingestion:

npm run dev -- prepare nairobi
  • Geofabrik에서 국가 PBF 파일을 다운로드합니다.
  • osmium(도커 사용)으로 경계 박스를 잘라냅니다.
  • 주행 가능한 도로 종류만 필터링하고, GeoJSON으로 내보내며, 토폴로지를 검증합니다.
  • 첫 실행 후 결과를 캐시합니다.

regions.json 매니페스트는 전 세계 주요 도시를 포함하고 있어, 도시를 전환하려면 인자를 하나만 바꾸면 됩니다.

빌더는 연결되지 않은 컴포넌트를 제거하고, 차선 수, 도로 표면 품질, 원형 교차로, 접근 제한, 교통 신호등 등 OSM 태그를 파싱하며, 역방향 일방통행이나 거의 중복된 노드와 같은 특수 경우도 처리합니다.

교통 현실감

A* 엔진은 경로 비용을 계산할 때 BPR(Bureau of Public Roads) 혼잡 함수를 적용합니다. 도로 용량은 OSM 차선 데이터를 기반으로 합니다. 차량이 구간에 축적될수록 경로 비용이 증가하고 교통은 자연스럽게 대체 회선으로 이동합니다 — 전문 교통 할당 모델에서 사용되는 동일한 원리입니다.

추가 현실감 레이어는 다음을 포함합니다:

  • 노면 품질 속도 계수
  • 교통 신호 교차점 지연
  • 활성 사고 상태를 키로 하는 사고 인식 경로 캐시

시뮬레이션 시계는 시간에 따라 변하는 수요(출퇴근 시간 증폭, 야간 감소)를 구동하고, 서버는 정기적으로 엣지별 혼잡 스냅샷을 방송합니다. UI는 이를 구글 지도 스타일의 색상 램프(녹색에서 빨강)로 렌더링하며, 실제 교통이 흐르는 도로만 색칠합니다.

Routing Quality

  • Handles OSM turn restrictions
  • Enforces forward‑only roundabout traversal with speed reduction
  • Filters out private and restricted‑access roads
  • Computes an admissible heuristic from the network’s actual speed range rather than a hard‑coded constant

Geofencing

지도에 다각형을 그리며, 이름을 지정하고, 유형과 색상을 할당합니다. 서버는 매 틱마다 레이‑캐스팅 검사를 수행하고 WebSocket을 통해 진입/퇴출 이벤트를 방송합니다. 기능으로는 전체 REST CRUD, 알림 패널, 그리고 구역별 토글이 포함됩니다.

차량 종류 및 트레일

지원되는 차량 종류: 자동차, 트럭, 오토바이, 구급차, 버스 — 각각 고유한 속도 프로필, 가속 곡선, 도로 제한 및 특수 동작을 가집니다. 차량 구성은 시작 시점에 설정할 수 있습니다.

각 차량은 지도에 서서히 사라지는 빵부스러기 트레일을 남기며, 원형 버퍼에 저장되고 불투명도 그라디언트로 렌더링됩니다. 트레일 길이는 조정 가능합니다.

WebSocket 구독 필터

클라이언트는 플릿, 차량 유형 또는 지리적 경계 상자를 기준으로 WebSocket 피드를 필터링할 수 있습니다:

{
  "type": "subscribe",
  "filter": {
    "fleetId": "fleet-1",
    "vehicleType": "truck"
  }
}

시스템은 이전 버전과 호환됩니다 — 필터가 없는 클라이언트는 모든 데이터를 수신합니다.

UI 전면 개편

All interactive components were migrated to React Aria for proper accessibility. The visual layer received a glassmorphism theme with tiered depth, a custom fuzzy search with match highlighting, and tighter panel proportions.

Under the hood:

  • Fleet analytics dashboard with sparkline KPIs
  • Structured logging with correlation IDs
  • Health endpoint
  • CI‑enforced test coverage across all workspaces

시도해 보기

git clone https://github.com/ivannovazzi/moveet.git
cd moveet && npm install && npm run dev

Dashboard는 localhost:5012에서 사용할 수 있습니다. MIT 라이선스. GitHub 저장소.

0 조회
Back to Blog

관련 글

더 보기 »