TAAFT
Free mode
100% free
Freemium
Free Trial
Deals

BaseMax / TehranMetroMap

This project is an interactive, bilingual map of the Tehran Metro system using OpenStreetMap (OSM) tiles and Leaflet.js. It includes a searchable list of all stations in both Persian and English, auto-centers the map when a station is clicked, and uses geolocation caching to improve performance.

0 0 Language: JavaScript License: MIT Updated: 5mo ago

README

Tehran Metro Map

This project is an interactive, bilingual map of the Tehran Metro system using OpenStreetMap (OSM) tiles and Leaflet.js.
It includes a searchable list of all stations in both Persian and English, auto-centers the map when a station is clicked, and uses geolocation caching to improve performance.


๐Ÿ“ฆ Project Files

TehranMetroMap/
โ”œโ”€โ”€ index.html       # Main HTML entry point
โ”œโ”€โ”€ style.css        # Custom RTL-compatible styling
โ”œโ”€โ”€ script.js        # Metro logic and map interactivity
โ”œโ”€โ”€ preview.jpg      # Screenshot preview of the app
โ”œโ”€โ”€ LICENSE          # MIT License
โ””โ”€โ”€ README.md        # This file

๐Ÿš€ Features

  • โœ… OpenStreetMap-based map using Leaflet.js
  • โœ… Supports Persian and English station names
  • โœ… Smart search with fuzzy Persian/Latin matching
  • โœ… Clickable station list auto-centers the map
  • โœ… LocalStorage-based geocode caching (using Nominatim)
  • โœ… Responsive and mobile-friendly design
  • โœ… No API keys or accounts required
  • โœ… Fully open-source, MIT-licensed

๐Ÿ–ฅ๏ธ Usage

  1. Download or clone this repository:

    git clone https://github.com/BaseMax/TehranMetroMap.git
    cd TehranMetroMap
  2. Open index.html in your browser:

    start index.html

    Or double-click it from your file explorer.

No server or build tools are required.


๐Ÿ“ How It Works

  • The station list (script.js) contains over 120 metro stations, each with a Persian and English name.

  • When you search for a station, it searches both fields smartly.

  • Clicking a station will:

    • Geocode it using the free OSM Nominatim API (if not cached)
    • Place a marker on the map
    • Auto-center and zoom on the location

๐Ÿ“ท Preview

Map Preview

๐Ÿ“š Technologies Used

  • Leaflet.js โ€“ Open-source mapping library
  • OpenStreetMap โ€“ Free global map tiles
  • Nominatim โ€“ Public geocoding API (used respectfully with caching)

โš ๏ธ Notes

  • This project uses public Nominatim for geocoding. It is rate-limited and should not be abused.

  • For production use or heavy traffic, you should:

    • Self-host your geocoder
    • Or replace coordinates with pre-geocoded lat/lon data

๐Ÿ“„ License

This project is licensed under the MIT License.

ยฉ 2025, Seyyed Ali Mohammadiyeh (Max Base)

https://github.com/BaseMax

0 AIs selected
Clear selection
#
Name
Task