Friday, April 27, 2012

Macro Tubes, Canon T3i and Focus Stacking

So I got a new toy this week - Macro Extension Tube Kit Compatible with Canon Cameras.  Essentially it's a set of spacers that tweak the focus range of standard lenses to allow them to shoot macro more effectively.  They can be a little clunky to use, as they are literally just a spacer between the lens and the camera.  This means you lose any connectivity between camera and lens - aperture control and autofocus are lost.  But they cost less than $10 shipped, so I figured they would be fun to play around with.  The alternative was to invest in a macro lens, which I can't justify.

Anyway, they arrived on a particularly boring day.  Construction in our neighborhood meant a planned power outage for half the day.  Seeing as I am studying Electrical and Computer Engineering, I didn't have much to do without Electricity.  So I got to play with them for a few hours, figuring out how to do everything a little more manually than usual.

So I took a few random shots:

Close up of my computer monitor.  Each pixel is composed of 3 little bars - red, green, and blue - which can be see quite clearly.  This was zoomed in a bit from the original image and cropped.
A close up of my tool case. 
The tag on my son's stuffed animal.
They were some pretty random images, mostly the result of thinking "What could I take a close up picture of next?",  but I was pleased with the clarity of using the macro tubes.  They do create a pretty narrow depth of field, so manual focus is tricky, but it's fun to play around with.

One interesting subject I have been looking at is focus stacking.  When you have a narrow depth of field, you can take multiple pictures of a subject, at different focuses, and later combine them into a complete image, with a greater depth of field than any of the originals.  So I gave it a shot by taking a picture of my wedding ring sitting on top of a white piece of paper.  The software I used was Enfuse, which is a little tricky to use, but once setup it does a great job of pulling the whole image together.

The middle of the paper comes into focus, as well as the bottom edge of the ring.
The paper is in focus in the top right of the image.  The bottom left is out of focus.  The ring is completely out of focus.
The bottom left of the paper is in sharp focus, and a good part of the far side of the ring is in focus.
The paper is starting to move out of focus, as is the far side of the ring.
The paper is out of focus, and the near side of the ring is coming into focus.
The near side of the ring is in sharp focus.



And the final result:

Notice how the paper, the far side of the ring, and the near side of the ring are all in focus.

I used pretty conservative and standard setting with Enfuse.  Some things are more in focus than others, which I could probably fix by tuning Enfuse a little more.  I was very impressed by how well Enfuse combined the images on it's own.

Overall, the macro tubes are fun to play around with.  Probably worth the $10 to have on hand in case you ever feel an artistic need to take macro shots.  Enfuse and focus stacking are definitely something I'm going to have to play around with more in the future.

Thursday, April 5, 2012

Using Raphael.js and Backbone.js together

I'm a big fan of Backbone.js. It's lightweight enough to throw into any webapp I'm building, large or small. At the very least it gives me some guidelines on how to organize my code. In larger apps the synchronization with the backend makes my life a lot easier.

An app I'm currently working on makes heavy use of Raphael.js, a great SVG library. In order to unify my handling of user events, I extended the Backbone.js library a little. It's a simple change, but I really like what it did to the organization of code.



As you can see, my goal was to be able to address user interaction with Raphael object in the way I can address interaction with the DOM. DOM events can be specified under events via a "<selector> <event>" syntax, so one can do ".button click" or "#myElement customEvent". Since Raphael abstracts out the DOM from the SVG objects, I wanted to preserve the Raphael events but be able to throw them in with DOM events. So the delegateRaphaelEvents method converts Raphael events to DOM events in the form "raphael:<object name>:<event>".  The assigned callback function gets passed two objects, a jquery event object and a raphael event object.

It works great and keeps my code well organized.  Enjoy!