Xkcd's world - pieced together with AngularJS (warning: big images) | Hacker News Reader

Xkcd's world - pieced together with AngularJS (warning: big images)

embed.plnkr.co

220 pointsgeelen47 comments

Source here: http://plnkr.co/edit/IfpBH4

This was as big as I could get it before my computer started to grind to a halt, but it's more of a demo of how little code it takes to do this sort of thing in AngularJS than anything else.

Took me away from building http://goodfil.ms for about 40 minutes all up.

Open articleView on HN

My fully zoomable (think google maps) version based on http://leaflet.cloudmade.com

http://xkcd-map.rent-a-geek.de/

This is pretty awesome and more easily navigable.

this should be on top - great work!

Best one yet in my opinion. Thanks.

Great work, much easier to explore now! I spent far to long this morning dragging myself down a tunnel.

Great work! Two minor problems:

1) Zooming is accompanied by a sideways wobble on Chrome/Linux

2) Solid black tiles are shown as solid white

In the original, the supposedly black tiles were actually just missing images, allowing the black background to show through. That's why they're white here. The author has used a solid background for the whole map, instead of having a black background for the bottom half.

Not sure about 1), but 2) is fixed now.

Thx for the effort, but: I already discovered more than is shown on your map, I think! going left, I followed the first tunnel I found - and found an exit into the open. Could not find that on your version at all. Is xkcd changing tiles?

Having trouble loading the parent link so here's my own version for anyone else with the same problem:

http://dl.dropbox.com/u/20403079/xkcd1110map.zip

I had this master plan of putting it into a webpage and using some sort of screen-print extension or JS to save it as one huge image. But as of now I've now spent more time on the capture part of it than I did on the initial scripts to grab the files and render them out in JavaScript, and need to get back to work instead.

If this helps anyone get closer to a full image, please post the result!

Full image in PDF (close enough to full res for readable text balloons): http://s.rlink.co/JZ6G

Very nice. I like how the separate sections are links to the actual images.

Created it by creating an image of http://iclub.site40.net/xkcd.html with [Paparazzi!](http://derailer.org/paparazzi/)

The javascript crashed my browser D:

Dropbox says "This account's public links are generating too much traffic and have been temporarily disabled!" so I put a backup on Cloud app: http://news.ycombinator.com/item?id=4543626

Source here: http://plnkr.co/edit/IfpBH4

This was as big as I could get it before my computer started to grind to a halt, but it's more of a demo of how little code it takes to do this sort of thing in AngularJS than anything else.

Took me away from building http://goodfil.ms for about 40 minutes all up.

Looks like some poor guy ran in to a creeper:

http://imgs.xkcd.com/clickdrag/18s3e.png

Cool hack, but I can't help but feel like this completely misses the point.

After 45 minutes, my index fingers are absolutely warn out from using a trackpad. I really wish he would have made it navigable by more than just click & drag. I do wish this was more thorough, though.

Chrome users can use keyboard to navigate map in fullscreen - code here http://www.reddit.com/r/comics/comments/104hbr/xkcd_click_an...

You didn't expect it would be so big?

To me that's why its so magical. Its actually expensive in time and effort to navigate, so you feel like you're investing something in order to explore. This also means that its difficult to see every part of the image, so you're left with a sense of frontiers yet unexplored when you navigate away from the page. The zooming versions are cool but, to me, actually take away from what Randall is trying to achieve here.

I think it still works with zooming because the scale is so extreme that it leaves you wondering whether a tiny smudge is worth zooming in on. And once you zoom in far enough to read the text, the surrounding objects look as big as they're meant to be.

I thought that it was the "click" part of the original navigation that really frustrated me, rather than only seeing a little bit at a time. I gave up on the original in a few minutes because my hands/wrists were aching after using a touchpad and then a mouse

I used the zoom versions after the fact primarily so I could swipe to look at the original 1:1 more comfortably, and then only later to follow up on what I thought (correctly) was just a bunch of blank space. Clicking to drag specifically really dampened my enthusiasm for going off in random directions to investigate the whole thing.

Ahhh I see. I have three finger drag enabled, so not as much of a pain.

> If you're having fencepost problems I feel bad for you, son--

> I've got 99 problems but somehow solved 101

lol, if it hadn't been for reinierladan I never would have seen that one. It's http://imgs.xkcd.com/clickdrag/1n9e.png (to the right of the windmills)

Nice one. If it wasn't for myself I wouldn't have found the second x-wing. This thing is too big and too epic.

The hack is interesting but it ruins the experience of the discovery of the world :(

I can't help to think that these hacks were somewhat expected and intended by Randall

There's some stuff up in the sky that I don't know how you would find otherwise.

Creator of Plunker here. Big thanks to the Nodejitsu and Mongolab folks whose services are strong enough to compensate for my crappy code being hit by a Hackernews assault.

Nice, but it is missing some images, like this: http://github.com/danielribeiro/xkcd_grab/blob/master/1n33w....

Edit: somebody else has posted the full html file online: http://edc.srvs.us/1110/

The full image set can be grabbed here http://github.com/danielribeiro/xkcd_grab

People who want to see the whole tile as images, can see this comment from the other thread: http://news.ycombinator.com/item?id=4542660

I created a high res PDF with readable text balloons of this awesome big image - (hosted in my dropbox) http://s.rlink.co/JZ6G

Does this remind anyone else of Limbo, the monochrome video game?

Yes.

Not enough horrible, pointless deathtraps.

A friend tells me there's a Limbo reference in there but I don't know what it is.

I must be missing the point to this because I'm having a "huh, cool? move on moment"; but it's the top item on the front page right now. Can someone shed some light at what I'm looking at?

The latest XKCD comic features a panel which you drag around to explore a world. This is that map of that panel.

It's kind of a spoiler.

Check out the original post here: http://xkcd.com/1110/

wish there's a way to zoom in/out.

Doable with leaflet (https://github.com/CloudMade/Leaflet), if only I did not have to finish this paper right now...

That was the biggest time waster I had in so many time. My hand hurts but I loved it.

I appreciate it. After spending so much time clicking around and enjoying, and being near positive I've seen it all, I like having this to be sure.

I wanted to do this but felt it is cheating on xkcd. He did not intend this to viewed as such.

Actually, I am pretty certain he fully expected all kinds of alternate views to spring up within hours.

Booooo! ;)

Reply on news.ycombinator.com