The MultiScaleImage class is one of the key objects of Silverlight's Deep Zoom technology. MultiScaleImage is modeled after MediaElement and allows a user to open a single multi-resolution image. For information about the format, see Deep Zoom.

By default, a user cannot zoom into or pan across the image loaded by MultiScaleImage. However, MultiScaleImage includes methods to zoom and pan, which can be utilized by the developer.

By default, the image loaded by MultiScaleImage zooms (expands) onto the page when the page first loads. You can disable this behavior by setting the UseSprings property to false. However, you will probably want to set this property to true when the user begins interacting with the image.

In this simple example, the MouseEnter event is used to zoom into the middle of the image when the mouse pointer moves over the image.

Run this sample

<MultiScaleImage x:Name="deepZoomObject" Source="source/items.bin" 
 MouseEnter="DeepZoomObject_MouseEnter" />

private void DeepZoomObject_MouseEnter(object sender, MouseEventArgs e)
{
    if (deepZoomObject.UseSprings = false)
    {
        deepZoomObject.UseSprings = true;
    }

    // The ZoomAboutLogicalPoint method allows you to zoom and pan
    // in the same step. The first parameter is the zoom (3x) and the
    // second and third parameters are the respective x and y coordinates
    // of the logical point to zoom around.
    this.deepZoomObject.ZoomAboutLogicalPoint(3, .5, .5);
}

For a list of the operating systems and browsers that are supported by Silverlight, see Supported Operating Systems and Browsers.

Reference

Other Resources