Road Chainages + Multi-Road KML

Roads (Visibility + Chainage Ranges)

Use 0-500,1000-2000 format. Highlights: Red=Budgeted, Green=DLP, Pink=AMC
Always export GeoJSON to save your work!

Generate Chainage KML/KMZ

0 = no ticks
Ready

🛣️ Technical Manual: Multi-Road Network & Chainage Asset Management System

System Purpose: Advanced GIS engine for linear infrastructure analysis, automated horizontal chainage marker generation, directional stationing, Defect Liability Period (DLP) / Annual Maintenance Contract (AMC) asset tagging, and native Google Earth (KML/KMZ) spatial exports.

1. System Architecture & GIS Libraries

The application integrates four industry-standard spatial processing libraries to manage geospatial linear alignments on a client-side interface:

Library Engineering Function
Leaflet.js (v1.9.4) Interactive viewport rendering using Web Mercator tile projection (EPSG:3857) with dynamic vector overlay management.
toGeoJSON (v0.16.0) Parses raw XML Keyhole Markup Language (KML) elements into standardized GeoJSON LineString feature arrays.
Turf.js (v6.5.0) Provides high-precision geodetic operations along the WGS-84 reference ellipsoid (linear interpolation, geodesic length, tangent bearings, and path slicing).
JSZip (v3.10.1) Handles binary decompression of compressed KMZ archive files and compresses generated XML KML structures into native KMZ packages for Google Earth Desktop/Mobile.

2. Core Mathematical Models & Geodesic Algorithms

A. Tangent Bearing & Perpendicular Offset Mechanics

To position tick marks and text labels strictly orthogonal to the centerline, the system evaluates forward bearings ($\theta$) along tiny segment deltas ($\Delta s = 1\text{m}$) using spherical trigonometry:

$$\theta = \text{atan2}\left(\sin(\Delta\lambda)\cdot\cos(\phi_2), \; \cos(\phi_1)\cdot\sin(\phi_2) - \sin(\phi_1)\cdot\cos(\phi_2)\cdot\cos(\Delta\lambda)\right)$$
Where $\phi_1, \phi_2$ are latitudes and $\Delta\lambda$ is the difference in longitude.

The perpendicular tick orientation angle ($\alpha$) and direct point displacements ($\Delta \text{Lat}, \Delta \text{Lon}$) relative to global mean Earth radius ($R = 6,377,575\text{ m}$) are calculated as:

$$\alpha = (\theta + 90^\circ) \pmod{360^\circ}$$ $$\Delta \text{Lat} = \left(\frac{dy_N}{R}\right) \times \left(\frac{180}{\pi}\right), \quad \Delta \text{Lon} = \left(\frac{dx_E}{R \cdot \cos(\text{Lat})}\right) \times \left(\frac{180}{\pi}\right)$$

B. Chainage Directionality (Forward vs. Backward Stationing)

Road alignments often possess physical survey chainages that run reverse to the digitized direction of the KML vector line. The engine accounts for this via directional linear interpolation:

  • Forward Direction ($\rightarrow$): $\text{Chainage}_d = \text{Start Chainage} + d_{\text{along}}$
  • Backward Direction ($\leftarrow$): $\text{Chainage}_d = \text{Start Chainage} - d_{\text{along}}$

Standard engineering chainage formatting converts meters into standardized stationing syntax (e.g., $12,450\text{ m} \rightarrow \mathbf{12+450}$).

3. Key Structural Modules

Module I: Multi-File Ingestion (KML / KMZ Parsing)

The ingestion pipeline handles raw XML text alongside compressed .kmz archives. It validates vectors, assigns continuous prefix identifiers (e.g., R1, R2), establishes initial chainage settings, and stores asset attributes.

// Extracts internal KML file from binary KMZ archive if (file.name.toLowerCase().endsWith('.kmz')) { const zip = await JSZip.loadAsync(file); const kmlFile = Object.values(zip.files).find(f => f.name.toLowerCase().endsWith('.kml')); kmlText = await kmlFile.async("string"); }

Module II: Multi-Category Asset Tagging & Slicing

Civil projects require tracking administrative boundaries along centerlines—such as Budgeted stretches, Defect Liability Period (DLP) zones, and Annual Maintenance Contract (AMC) segments. The engine accepts CSV chainage ranges (e.g., 500-1200, 2000-3500), converts them to relative distances, and slices the base polyline using turf.lineSliceAlong() for color-coded map display:

Asset Layer Category Map Overlay Color KML Style ID
Base Road Alignment Slate Gray (Weight: 3px) #path-base
Budgeted Work Stretch Bright Red (Weight: 6px) #budgeted
Defect Liability Period (DLP) Emerald Green (Weight: 6px) #dlp
Annual Maintenance Contract (AMC) Magenta (Weight: 6px) #amc

Module III: Adaptive Map Zooming & Label Collision Prevention

To prevent visual clutter across long road networks, the engine scales chainage label frequency based on map zoom levels (when Auto-Zoom is active):

Map Zoom Level ($z$) Applied Chainage Interval Engineering Use Case
$z < 8$ 100,000 meters (100 km) Statewide / National Highway Overview
$8 \le z < 10$ 50,000 meters (50 km) District Network Planning
$10 \le z < 12$ 2,000 meters (2 km) Sub-Division Project Reviews
$12 \le z < 14$ 1,000 meters (1 km) Standard Construction Stationing
$14 \le z < 16$ 500 meters Site Inspection & Progress Verification
$z \ge 16$ 200 meters Detailed As-Built & Cross-Section Audits

Module IV: Local Storage Protection & Auto-Export

The engine maintains browser memory stability via HTML5 localStorage monitoring. Because browser storage is limited to ~5MB, the system monitors used space and triggers safety measures if capacity is exceeded:

💾 Automated Emergency Data Protection: When local browser storage usage exceeds 90%, the engine triggers an automated JSON backup download (EMERGENCY_EXPORT_TIMESTAMP.geojson) to prevent data loss.

4. Workflow & KML Export Capabilities

  1. Upload Alignment Files: Drag and drop individual KML or archived KMZ files to populate the road list.
  2. Adjust Parameters: Enter starting chainages, set forward/backward direction, and define budget, DLP, or AMC ranges.
  3. Review Alignment View: Zooming automatically adjusts screen density. Dynamic labels feature auto-flipping to remain readable without reversing text orientation.
  4. Generate KML / KMZ Assets: Export single alignments or full networks with embedded Placemark labels, orthogonal tick marks, and custom XML styles for Google Earth desktop reviews.
💡 Mobile Survey Compatibility: Includes a Geolocation API hook (map.locate) with live accuracy tracking ($r\text{ meters}$) to assist site engineers during field inspections.