Warcraft map stylesheet for London

So this is an accurate (in terms of coordinates) map of London, generated from OpenStreetMap data:

You can pan around quite a bit and use the scroll wheel to zoom. To achieve this, I created the following geographic stylesheet:

http://unterbahn.com/cartagen/warcraft.gss

The map is built on Cartagen, a mapping framework for viewing and geographic data in a dynamic, personally relevant way. Cartagen uses the GSS (Geo Style Sheet) format, which allows users to design maps with CSS-like styles. Learn more at Cartagen.org and the Cartagen wiki, or download the source at Google Code.

Go to Cartagen.org to view anywhere in the world through this stylesheet.

Dabu!

Quick update: some users (read: most) are having trouble zooming in and out! This is because of a known last-minute bug in the 0.6 release of Cartagen, and only affects maps embedded in other pages. It does not affect cartagen.org. For a quick fix, to zoom you can also hold down the ‘z’ key and drag up and down on the map.
Followup update: zooming with the scroll wheel should work now. Thanks for your patience!



Tags: , ,

26 Responses to “Warcraft map stylesheet for London”

  1. London mapped in World of Warcraft style | timnhanh.us Says:

    […] Warcraft map stylesheet for London […]

  2. Gerg Says:

    What browser do I need to try this?

    I’ve tried firefox and chrome and in both cases all I get is an entirely green map and neither panning nor zooming do anything.

  3. Gerg Says:

    Huh, it seems if i click on it it starts loading. But if I zoom it breaks and just displays grass. At that point no amount of clicking or zooming will fix it.

  4. Brendon Says:

    It loads automatically in Safari 4. However, my experience with zooming is the same as Gerg’s; it breaks and displays grass (slightly patterned), and then further clicks and zooms do nothing.

  5. Mat Says:

    Does not work in Firefox 3.5, Internet Explorer 7, or Chrome. Firefox and Chrome produce a totally green map that can’t be interacted with. IE produces a lengthy text description for the map, rather than the map itself.

  6. AndyG Says:

    Works a treat for me (XP, F3.5; check your java). Love the on-ye-fly generation. I feel a sudden urge to pillage tracts of Devon…

  7. London mapped in Warcraft II style | timnhanh.us Says:

    […] Warcraft map stylesheet for London […]

  8. Jeffrey Warren Says:

    Hi, all – we added a patch to cause mouse scroll to zoom but not scroll the containing page, at the last minute, and it seems a bit buggy. We’ll roll out a new version shortly with fixed scrolling, but for now scrolling does work on the main Cartagen site (the bug is iframe-specific, so it only shows up on maps embedded in other pages).

    Try it at: http://cartagen.org/?gss=http://unterbahn.com/cartagen/warcraft.gss

    For those of you who cannot see anything at all, if you could send us your JavaScript error output that would be great, and we should be able to add fixes asap. This does not work in Internet Explorer yet.

    If you’re particularly ambitious, maybe you could add your own issue reports on our Google Code page, here: http://code.google.com/p/cartagen/issues/entry

  9. The World Condensed » Blog Archive » London mapped in Warcraft II style Says:

    […] Warcraft map stylesheet for London […]

  10. London mapped in Warcraft II style | BLOGCHINA Says:

    […] Warcraft map stylesheet for London […]

  11. xen Says:

    IE8, compatibility-mode:

    Details zum Fehler auf der Webseite

    Benutzer-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30; .NET CLR 3.0.04506.648; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
    Zeitstempel: Mon, 27 Jul 2009 08:17:57 UTC

    Meldung: Bezeichner, Zeichenfolge oder Zahl erwartet
    Zeile: 6627
    Zeichen: 1
    Code: 0
    URI: http://mushroommap.com/cartagen/cartagen.js

    Meldung: ‘Event’ ist undefiniert
    Zeile: 18
    Zeichen: 3
    Code: 0
    URI: http://mushroommap.com/find/london?gss=http://unterbahn.com/cartagen/warcraft.gss&fullscreen=true&zoom_level=0.6

    Meldung: ‘Prototype’ ist undefiniert
    Zeile: 57
    Zeichen: 3
    Code: 0
    URI: http://mushroommap.com/find/london?gss=http://unterbahn.com/cartagen/warcraft.gss&fullscreen=true&zoom_level=0.6

  12. xen Says:

    ie 8, non-compatible:

    Details zum Fehler auf der Webseite

    Benutzer-Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30; .NET CLR 3.0.04506.648; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
    Zeitstempel: Mon, 27 Jul 2009 08:19:45 UTC

    Meldung: Das Objekt unterstützt diese Eigenschaft oder Methode nicht.
    Zeile: 6848
    Zeichen: 3
    Code: 0
    URI: http://mushroommap.com/cartagen/cartagen.js

    Meldung: ‘$C.canvas’ ist Null oder kein Objekt
    Zeile: 6852
    Zeichen: 3
    Code: 0
    URI: http://mushroommap.com/cartagen/cartagen.js

  13. JasKerr Says:

    Interesting behavior (which may help in debugging) —

    If the scroll-wheel zoom fails, reload the page and use the z+grab zoom; -then- use the scroll wheel. It will work.

  14. JasKerr Says:

    Forgot to mention — very cool use of mapping and stylesheets!

  15. 范帅军 Says:

    你很有才!!!!!!

  16. baal Says:

    cool!!

    你很有才!!!!!!

    http://www.sula.cn/pj

    I love it

  17. Community-Chest » Bookmarks for juillet 28th through juillet 30th Says:

    […] Unterbahn » Blog Archive » Warcraft map stylesheet for London – […]

  18. Ajaxian » Cartagen: Rich mapping on the client side Says:

    […] As an example, we rendered the world using accurate geographic data, but styled as if it was a Warcraft map. The project is free and open source software — the source is available, and the project is […]

  19. Cartagen: Rich mapping on the client side | Guilda Blog Says:

    […] As an example, we rendered the world using accurate geographic data, but styled as if it was a Warcraft map. The project is free and open source software — the source is available, and the project is […]

  20. Cartagen: Rich mapping on the client side « LocalLab : Foire aux Infos Says:

    […] As an example, we rendered the world using accurate geographic data, but styled as if it was a Warcraft map. The project is free and open source software — the source is available, and the project is […]

  21. Cartagen: Rich mapping on the client side - Programming Blog Says:

    […] As an example, we rendered the world using accurate geographic data, but styled as if it was a Warcraft map. The project is free and open source software — the source is available, and the project is […]

  22. Cartagen: Rich mapping on the client side | Simple Test Says:

    […] As an example, we rendered the world using accurate geographic data, but styled as if it was a Warcraft map. The project is free and open source software — the source is available, and the project is […]

  23. The Ashes » Blog Archive » Cartagen: Rich mapping on the client side Says:

    […] As an example, we rendered the world using accurate geographic data, but styled as if it was a Warcraft map. The project is free and open source software — the source is available, and the project is […]

  24. PPG Says:

    ···(⊙o⊙)?KANBUDONG&ZHAOBUDDAO

  25. Eddy Says:

    Moving on to the reserve capacity, you need to know that it’s
    the amount of minutes by which your automobile will run
    using only the battery if the alternator fails.

    If they say they can’t do that, then walk,
    because another dealership will be happy to offer
    that rate. Check with MVD – Before you buy a new or used vehicle, check with your motor vehicle department (MVD) and inquire
    how much sales taxes are in your state.

  26. Her Latest Blog Post Says:

    Thank you for another magnificent post. The place else may just anybody get that kind of info in such
    a perfect means of writing? I’ve a presentation next week, and
    I am on the search for such info.

    Feel free to surf to my site: Her Latest Blog Post

Leave a Reply