![](https://images.ecency.com/DQmWgubS8ZP8tq4VDwXcUKX6cqNeasG3adUQLdcDPTbaHN7/image.png)

I recently set up a server on IONOS to create a simple yet effective local accident-reporting web application. This tool allows community members to easily report traffic accidents and visualize them in real-time on an interactive map.

🚧 Why This Matters

Real-time accident reporting helps locals avoid traffic congestion, improves community safety, and raises awareness about accident-prone areas.

⚙️ Technologies Used

Python (Flask): Lightweight web framework
Folium: Interactive mapping in Python
Simple Text Storage: For ease and simplicity (accident_reports.txt)

🛠️ Application Features

🔸 Report Submission

Residents submit accident reports via a straightforward web form.

🔸 Report Storage

Reports are stored in a local file for easy retrieval.

🔸 Interactive Mapping

Folium dynamically visualizes accident locations.

📌 Core Application Code

Below is the full, self-contained Flask application code that handles accident reporting, storage, and map visualization:

```python
from flask import Flask, render_template_string, request, redirect, url_for
import folium
import os

app = Flask(name)

REPORTS_FILE = 'accident_reports.txt'

Load all accident reports

def load_reports():
if not os.path.exists(REPORTS_FILE):
return []
with open(REPORTS_FILE, 'r') as f:
lines = f.readlines()
reports = []
for line in lines:
try:
lat, lng, desc = line.strip().split('|', 2)
reports.append((float(lat), float(lng), desc))
except:
continue
return reports

Save new accident report

def save_report(lat, lng, desc):
with open(REPORTS_FILE, 'a') as f:
f.write(f"{lat}|{lng}|{desc}\n")

@app.route('/', methods=['GET', 'POST'])
def index():
if request.method == 'POST':
lat = request.form.get('lat')
lng = request.form.get('lng')
desc = request.form.get('description')
if lat and lng and desc:
save_report(lat, lng, desc)
return redirect(url_for('index'))

# Generate interactive map
m = folium.Map(location=[39.5362, -76.3526], zoom_start=11)
for lat, lng, desc in load_reports():
    folium.Marker([lat, lng], popup=desc).add_to(m)
map_html = m._repr_html_()

# Simple HTML interface
html = '''
<!DOCTYPE html>
<html>
<head>
    <title>Harford County Accident Map</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style>
        body { font-family: Arial, sans-serif; background: #f4f6fa; }
        .container { max-width: 420px; margin: auto; padding: 24px; }
        input, textarea { width: 100%; margin-bottom: 8px; padding: 6px; }
        button { padding: 8px; width: 100%; background: #4267B2; color: white; border: none; }
    </style>
</head>
<body>
    <div class="container">
        <h2>Report an Accident</h2>
        <form method="POST">
            <input type="number" step="any" name="lat" placeholder="Latitude" required>
            <input type="number" step="any" name="lng" placeholder="Longitude" required>
            <textarea name="description" placeholder="Description" required></textarea>
            <button type="submit">Submit Report</button>
        </form>
        <div>{{ map_html|safe }}</div>
    </div>
</body>
</html>
'''
return render_template_string(html, map_html=map_html)

if name == 'main':
app.run(debug=True)

Building a Harford County Accident Tracker with Flask and Folium