Deep zoom with Microsoft SeaDragon

Posted February 20th, 2009 by Juozas

Seadragon is technology, which allows you to create applications  capable of displaying unlimited size images in users (small) display. It works similar to Google Maps, where you move (zoom) closer and closer to the ground and see more and more details. When I first saw it (video available here) I couldn’t believe my yes – how it is possible to scale so many pixels in one screen? Lets find out.

There are multiple implementations of Seadragon: Ajax or Silverlight based, mobile version and maybe more. All of them works the same – loads only that part of image which is now visible. What you need to do as developer is to create collection of images parts which will later be used to create zoom effect.

Deep zoom

Creating Deep zoom images is not hard at all – Deep Zoom Composer does all the work for you. I chose simplest way – imported one image and exported project as Seadragon Ajax application, but Composer allows you to create zoom-able galleries, group images to layers, upload project to PhotoZoom gallery, etc. Ajax version uses Xml index and thousands of small images, so I see possibility to create it dynamically.

My test project was using huge image from my university project named “RayTraced 3D Fractal”. I had only one very big image (10′000 x 10′000) which wasn’t from final version so it lacks proper antialising and because I compressed it (raw original was 1Gb size), smallest particles aren’t detailed enough. I will probably regenerate it someday to show full power of Seadragon.

Smoothness of transitions depends on Internet speed, but somehow whole application lags a little bit for me (especially when viewed in full-screen). I tried creating Silverligh version and it works much more smoother, so it probably has to do something with browser performance. However, embedded viewer is good enough to use in websites – JavaScript version is not as smooth as Silverlight one, but works in all browsers and doesn’t require any plug-ins.

In conclusion, Microsoft Seadragon is really nice technology and can be really helpful displaying very big images (maps? GPix photos?..). Maybe it’s practical only in rare cases, but it still shows how normal user interfaces can be used to manipulate huge amounts of data. I really like seeing Microsoft releasing such products.

Trackbacks/Pingbacks

  1. Creating Deep Zoom applications with C# | Juozas devBlog

Comments (2)

  1. Geo

    Microsoft does have some cool stuff :)

  2. Floyd Taveras

    Hello, I came across this blog post while looking for help with fixing Microsoft Silverlight. I have recently changed browsers from Opera to Microsoft IE 6. Just recently I seem to have a problem with loading sites that use Microsoft Silverlight. Every time I go on a page that needs Microsoft Silverlight, my browser does not load and I get a “npctrl.dll” error. I cannot seem to find out how to fix the problem. Any aid getting Microsoft Silverlight to work is greatly appreciated! Thanks

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">