How to make maps with Metro Map Maker

A overview of the most commonly-used features in Metro Map Maker

What's new in Metro Map Maker v6

For full release notes, see https://github.com/shannonturner/metro-map-maker/releases


Can you help me find my map?

If you've lost your map and can't find it, I can help. Send me an email with a picture of your map, the approximate date it was created, and/or some of the names of the stations. It helps if the station names are relatively unique; that's the easiest way for me to find your map.

Back to top

Can you add a map to the gallery?

If I really like a map, I'll add it to the gallery. But people make so many fun maps every day, I don't always get to look at all of them. If you've made a cool map and it's not in the gallery, I might have missed it -- send it to me!

If your map used to be included in the gallery and isn't anymore, sorry about that! Sometimes I rotate older maps out of the gallery to make room for newer maps.

Back to top

How can I suggest a new feature?

Tell me about what new feature you'd like Metro Map Maker to have, and how it would help you make cool new maps!

While I can't (or sometimes won't) build every feature that's requested, your input does help me know what the map making community wants and likes.

If you'd like to see a public list of feature requests and ideas, you can see them at https://github.com/shannonturner/metro-map-maker/issues

Back to top

How can I report a problem with Metro Map Maker?

If you encounter a bug or problem with Metro Map Maker, I want to know so I can fix it! Tell me what happened. It's especially helpful to include details like:

  • What you were doing just before the problem occured
  • What happened, in detail
  • What you expected to happen instead
  • A screenshot or video showing the problem

Back to top

Is there a community of other transit map enthusiasts?

If you'd like a place to share the maps you've made with other people, the reddit.com/r/TransitDiagrams subreddit has frequent posts of real and fantasy transit maps.

Back to top

How does autosaving work?

When you make a map, Metro Map Maker saves a copy of that map locally so if you close your browser, you can continue working on your map where you left off. If you go to metromapmaker.com, make an edit, close your browser, and open metromapmaker.com again, you'll see that your in-progress map.

However, there are some situations where this won't work. If you go to the URL of a specific map, like metromapmaker.com/map/wxtIWRy8, Metro Map Maker will show you the map at that URL. As long as you don't make edits, your map is still safely saved locally, and you can go to metromapmaker.com and edit it again.

But if you go to a specific map's URL, like metromapmaker.com/map/wxtIWRy8, and make an edit, that new map becomes the map that's saved locally. If you still have your map open in another tab, you can make an edit on that map to make that one the map that's saved locally again.

Summary: the last map you edited is the one that's stored locally.

I'm considering other ways to handle this differently in future versions of Metro Map Maker, and I'd like to hear your thoughts. Some possibilities include:

  • Option 1: Saving multiple maps locally and allowing you to pick which one you're working on in the menu

      Benefits

    • It would be frustrating to lose the map you were working on, or lose your progress if you didn't click Save and Share map, or were browsing other maps for inspiration and edited those.

      Drawbacks / Limitations

    • Clicking Save and Share is still preferable to locally-saved maps, as these are only available on your device (and if you're using the same browser)
    • This would add more complexity to the menu
    • Technical details: relying on localStorage has a limit which varies by browser, so the amount of maps you could save locally would be dependent on several factors including how large and detailed your maps are. Using some test maps, it seems likely that 5-10 maps would be widely supported on almost all browsers.
  • Option 2: Adding a login system, allowing in-progress maps to be saved to your account

      Benefits

    • You could choose which maps are saved in-progress, up to a reasonable limit, and access them on any browser or device.
    • With a login system, you could see the maps you'd created previously all in one place, in addition to other benefits that come with having an account.

      Drawbacks / Limitations

    • A login system would add complexity. Although Metro Map Maker's underlying framework (Django) easily supports a login system, adding one still requires thoughtful implementation.
    • Metro Map Maker should always be easy to use without a login; most users probably don't want to make an account, they want to make metro maps!
    • If you lost access to your account, I wouldn't be able to restore your access, though you could reset your password on your own.
Back to top

How was Metro Map Maker built?

I built Metro Map Maker using Javascript for the controls and rendering, Python to validate and save maps, HTML for the layout, and CSS for the page styling. To save maps into the database and handle pages like the gallery and calendar, I use the Django framework.

Print-quality maps are created in SVG format, so you could load them into Inkscape, Illustrator, or a similar program and edit as you like.

The code is available to browse at https://github.com/shannonturner/metro-map-maker.

I'm considering creating a set of educational materials focused on how practically Metro Map Maker was built, how I created and then fixed specific bugs, and so on. If this is something you'd be interested in, let me know.

Back to top