Grätzl-Schätze — Neighborhood Gems Map

An interactive map for discovering and sharing local hidden gems in a city. Built for Vienna, but easily adaptable to any city.

Live Demo

Features

• Interactive Leaflet map with colored category markers
• Bilingual support (German / English) with URL parameter control
• Sidebar with search, category filters, and place cards
• "Suggest a place" modal with map picker and reverse geocoding
• Feedback system for existing places
• Geolocation support ("My location")
• Fully standalone — single HTML file, no build step
• Mobile responsive

How It Works

The app reads place data from a Google Sheets spreadsheet via a Google Apps Script web app (API). Users can suggest new places and leave feedback, which gets written to separate sheets for review.

Adapt It for Your City

This project is designed to be reusable. To set it up for your own city:

1. Upload the Google Sheet template to Google Drive
2. Deploy the Apps Script
3. Update index.html:
   • Replace the API_URL with your own Apps Script deployment URL
   • Change the default map center coordinates to your city
   • Update the Google Maps list links
4. Deploy via GitHub Pages or any static hosting

Google Sheet Structure

The spreadsheet needs 4 sheets:

• Places: columns for id, name, lat, lng, category, comment_de, comment_en, address, gmaps_url
• Categories: columns for key, name_de, name_en, color
• Suggestions: automatic columns
• Feedback: automatic columns

See google_sheets_template.xlsx.

Apps Script

The code for the Apps Script can be found in apps_script.gs. In your Google Sheet, go Extensions > Apps Script and paste it there. Then deploy the script, giving access to "Everyone". Copy the URL and paste it to API_URL in index.html.

Tech Stack

• Leaflet for maps
• OpenStreetMap tiles
• Nominatim for reverse geocoding
• Google Sheets + Apps Script as a simple backend
• Vanilla JavaScript, no frameworks

License

MIT — free to use, modify, and share.