While I was working at MOG these last six months, I was psyched to discover Justin Palmer's excellent javascript image cropper. I posted a small fix for it, enabling it to draw northwest, and then incorporated it into our codebase so that users could edit their photos easily after uploading them. It was a simple and elegant piece of code that integrated nicely with Prototype's utility classes (Position, Builder, etc).
So, when the time came for me to implement similar functionaltiy over a Google Map, I decided to take another look at Justin's code to see if I could adapt it to life in a cartographic environment. The result was Cropper.Map. I've only tested this a few days, and only on Mac Safari and Firefox, but so far it's working well for the needs of WalkingBoss Beta. Here's a screenshot:
A couple of notes:
- To avoid getting crazy coordinates after a user drags the map to a new position, I followed the advice of Mike Williams in this posting. As he warns, this code will probably break near the international date line.
- To create the box, you click once to start it and once more to finish it. This is not the most common rubber-band-box user interaction, but it's the best you can do , given that the mousedown event is sort of broken in Google Maps.
- Here were a couple useful references I found when creating this:
Leave a Reply