GeoTracker

Inspiration

I got inspiration from ATL’s night environment and how people need quick measurements for events, construction, marathons, and more.

What it does

GeoTracker lets users measure land, roads, or custom areas on a map for multiple purposes. Users can draw multiple polygons, calculate areas, undo points, delete polygons, and view total area in different units (m², km², acres, ft²).

How we built it

I used React, React-Leaflet, Leaflet, and Turf.js for area calculations. The app is built in VSCode and runs entirely in the browser.

Challenges we ran into

• Handling polygon coordinates and ensuring valid GeoJSON
• Fixing runtime errors caused by Turf.js polygon creation
• Making the UI intuitive for both standard and custom purposes

Accomplishments that we're proud of

• Multi-purpose polygon measurement
• Dynamic area calculation with multiple units
• Undo/Reset/Delete functionality
• Polygons with random colors for easy distinction

What we learned

• How to integrate React with Leaflet for interactive maps
• Managing state for complex geometric data
• Debugging runtime errors related to GeoJSON structures

What's next for GeoTracker

• Implement save/load feature for user polygons
• Improve UI/UX design with prettier components
• Add more map layers or satellite imagery for reference

Built With

• javascript
• leaflet.js
• turf
• vscode