| A Deep Zoom Blog |
Tales of Deep Zoom, creating interesting apps in Silverlight with Deep Zoom, cool new ways to present information
- Recent
- Popular
- Tags (0)
- Subscribers (1)
- Showing Photosynth Collections in Silverlight (2-D)September 3 2008
-
If you haven’t already, check out Photosynth, the latest release from Livelabs showing off this fantastic technology that stitches images together in 3-D space and lets you navigate your vacation photos. It's better seen than described in words, so don't hesitate to blow off a few minutes looking at the great Synths that have already come in from all over the world.
Well, the wonderful thing about Photosynth and Deep Zoom is that we share the same file format. A collection created in Photosynth can be opened in Deep Zoom and the items in the collection can be arranged to a developer’s liking.
Click below to see the application that lets you view any photosynth collection you may have found and liked, but don’t have a chance to look at because you are using a Mac (like me at home) or because you don’t have a supported browser.
How does one open a Photosynth collection?
Well, search for your favorite Photosynth, right click the link and copy it, or copy the URL from the address bar, and paste it into the viewer. The viewer does the rest to open the collection and lay it
- Synchronizing Images with the Deep Zoom contentAugust 19 2008
-
A very common request I have been getting is some sample that shows how you can synchronize content with Deep Zoom.
Click on the image below to start the app. Zoom in to see the various places I've lived.
So how is this done? Really there are two main concept I show in the app:
Synchronizing other content with Deep Zoom
When you set ViewportOrigin or ViewportWidth (or use the ZoomAboutPoint helper), deep zoom simply kicks off an animation to the new location. This animation happens entirely under the hood and is transparent to the developer. That's very nice for the dead simple zooming application, since the developer doesn't have to worry about making pretty animations when zooming and panning. Pretty animations are built in.
However, this behavior does cause a problem if you want to make other things in Silverlight move along with zooming and panning of the Deep Zoom image.
So what's the trick? Everytime a user pans or zooms, this application sets of a 0-length-storyboard that tracks what Deep Zoom is doing, and adjust size and position for the
- XREZ Extreme PanoAugust 13 2008
-
I've been meaning to post a little bit about how to do text properly in deep zoom, but I am having problems with the various tools I am using... I'll get that and other posts going soon. But since I set myself the goal to post something useful once a week (at least), I figured I'd talk about XREZ.
One of the applications I worked on as a sample was the XREZ Extreme Pano. This is an effort well worth checking out. Livelabs teamed up with the team from XREZ to make a set of very large shots of the Yosemite Valley.
They have a special rig that takes thousands of pictures that are later stitched together to very large single images. The images you can see in here are much bigger than anything a standard camera can offer. Of course this was the perfect opportunity for Deep Zoom to show off some real content!
If you want to find out more about the project, read up on XREZ's website about it.
The only difference really between this application and the one from the previous post is that I took more care to make the "zoomed out" view of the collection of images look simpler and cleaner. One of the problems with zooming UIs is that sometimes the view of things can appear cluttered if you show everything all the time. I am also not a fan of th
- Zooming with constraintsAugust 6 2008
-
My first blog post will be a small but useful little tip. One of the things that's not built into deep zoom is the ability to specify at which level to stop zooming out, and at which level to stop zooming in.
Check out the following example (which I will use in future blog posts for more examples). Please note that there is a bug in the mousehandler here where the browser still captures the wheel (not just the app), something I intend to fix in a future post.
This example is a very deep sparse image - it is a collection of vacation pictures I took while I was in Europe last summer. I laid them out nicely for a pleasant browsing experience.
One of the issues with simply checking the zoom level and resetting it when the zoom level passes a certain point is that Deep Zoom uses its own animations for zooming to a certain level. So simply checking the current zoom level when a user flicks the mouse wheel and ensuring that a certain level of zoom isn't passed doesn't do the trick - at the time you set the new zoom level, Deep Zoom only initiates the animation, but the current zoom level will not have changed. You need to instead anticipate what the zoom level will be after you zoom, and make sure to adjust the target zoom rate appropriately.
The way this is done here is to keep
