No description
  • JavaScript 50.3%
  • HTML 28.5%
  • CSS 21.2%
Find a file
Repository files (latest commit first)
Filename Latest commit message Latest commit date
Rukira c41eccaf6e
style: Cinzel/Inter fonts and larger, centered 28px map pins
- Load Cinzel (headings: popup titles, worlds label) and Inter (body)
  from Google Fonts, exposed as --font-heading/--font-body
- Grow pins from 18px to 28px (glyph 11px -> 17px), scale Leaflet
  iconSize/iconAnchor/popupAnchor accordingly
- Center the pin glyph optically: translate(1.01px, -1.45px) before the
  counter-rotation, solved from pixel-measured screen-space offsets in
  headless Chrome (avg residual offset < 0.05px)
2026-11-06 14:08:36 +00:00
assets/maps Initial version 2026-11-03 12:53:55 +00:00
config feat(config): enriched marker schema with load-time validation 2026-11-03 15:18:50 +00:00
css style: Cinzel/Inter fonts and larger, centered 28px map pins 2026-11-06 14:08:36 +00:00
dev feat(js): render icon pins and popup card for enriched markers 2026-11-03 15:31:19 +00:00
docs docs(docs): document the enriched marker structure and pin/popup rendering 2026-11-03 15:36:42 +00:00
js style: Cinzel/Inter fonts and larger, centered 28px map pins 2026-11-06 14:08:36 +00:00
vendor/leaflet Initial version 2026-11-03 12:53:55 +00:00
.gitignore Gitignore 2026-11-06 13:51:06 +00:00
index.html style: Cinzel/Inter fonts and larger, centered 28px map pins 2026-11-06 14:08:36 +00:00
README.md Proper docs 2026-11-03 13:07:38 +00:00

WoW Interactive Map

An interactive, static web map of World of Warcraft. Plain HTML/CSS/JS plus a vendored copy of Leaflet.

Quick start

The JSON configs are fetched at runtime, so the folder must be served over HTTP (opening index.html via file:// won't work):

python3 -m http.server 8000    # or: npx serve .

Then open http://localhost:8000.

Deploy

Upload the folder except dev/ (local dev tools only) to any static hosting service and it's live. Nothing else is required.

What's inside

  • Worlds switcher — Azeroth and Outland.
  • Zoom layers — zoom into a continent or island and its detailed map swaps in seamlessly (same position, same on-screen size).
  • Markers — read from config/markers.json; click a pin for its title and description.
  • Configurable UI — every string and theme color lives in config/ui.json. Restyle the whole map by editing JSON.

Configuration & development

See docs/:

  • docs/configuration.md — the three JSON config files (ui.json, worlds.json, markers.json) with full field references.
  • docs/development.md — project structure, how the world/zone layer system works, tech notes, and the marker calibration tool (dev/calibrate.html).

Map art credit

All map images are by Joel Laqua (Sturmbart) — https://www.artstation.com/sturmbart. The images are the artist's copyrighted work and are included here for personal, non-commercial use. Keep the in-app footer credit intact if you deploy publicly, and check with the artist before any commercial use.