Five years ago I got interested in interactive diagrams and made a few, but then got distracted by other things. I wrote a blog post about why I was interested in them. I've recently become interested in them again. Back then, I used Flash, but these days I think HTML5 is a good option. I generally make better progress by starting small, so I've started working on something fairly simple: a diagram showing where the “blind spots” are when driving a car.


(click through to try it)

It's not yet complete but I've already learned some things:

  • If you have your seat forward the blind spots are smaller than if you have your seat back.
  • The right side mirror shows much less area than the left side mirror. To see a larger area you need to distort the area, which causes things to look smaller. This is why you see “Objects are closer than they appear” on the right mirror but not the left mirror.

In retrospect, these should've been obvious, but the diagram is what made it clear to me. It also became clear that the diagram needs more work. I need to add an option to make the right side mirror curved (I'm not sure what the typical curvature is). I might need to calculate the effect of someone rotating their head. I should measure car mirrors and the driver position inside the car.

It's been a fun little project. I learned some Javascript and SVG, and I got to play with Mike Bostock's d3 library, even though it's overkill for a diagram like this. The process of working on the diagram helped me understand things and motivated me to learn more. I'd like to work on several more interactive diagrams to see if the car diagram is a special case or if interactive diagrams are generally useful for me.

Labels:

5 comments:

karl wrote at Thursday, August 25, 2011 at 5:58:00 AM PDT

incredibly interesting, thanks for sharing.

konberg wrote at Thursday, August 25, 2011 at 4:03:00 PM PDT

This is fun and educational. Also, impressive. It took me a while to figure out why I had three copies of this post in Reader until I realized it's probably due to you republishing it twice until you got a reader-friendly view. :)

Amit wrote at Thursday, August 25, 2011 at 8:12:00 PM PDT

Alas, I had a fight with Blogger. We scuffled for a while, it duplicated my post, and I deleted two copies. I won in the end but the scars went out on Reader and elsewhere.

Stephen Lacy wrote at Monday, September 19, 2011 at 4:43:00 PM PDT

I once had a VW, and purchased "European style aspheric/split side mirrors" for both sides. Man, what a *huge* difference. Basically, the mirrors have a slight curvature for the majority of the area, but on the outside edge, switch to aspherical where they're really wide angle. I once tested with a friend, and could literally see 360 degrees around the car without moving my head. Here's the best image I could find that demonstrates the effect: http://www.istargazer.ca/images/aspherical.jpg Note how much wider the angle is in the lower pictures.

Amit wrote at Monday, September 19, 2011 at 4:59:00 PM PDT

Stephen: interesting! I hadn't heard of car mirrors that varied the curvature in that way.