Silverlight / WPF - How to zoom a image without blur effect when image size increses

Asked By balaji mogadali on 26-Dec-11 02:52 PM

Earn up to 10 extra points for answering this tough question.

hi frds
How to zoom a image without blur effect when image size increses

pls help

Peter Bromberg replied to balaji mogadali on 26-Dec-11 06:56 PM

You can only "zoom" (increase the display size) of an image to the extent that the image's pixels-per-inch will support it. If you take an image that is 120X120 pixels and display it at 1200X1200 pixels, it is going to look blurry. Sorry, but that's just pure physics.

Riley K replied to balaji mogadali on 26-Dec-11 07:56 PM

Deep Zoom enables you to zoom and pan high-resolution images rapidly. Deep Zoom achieves this by using multi-resolution images.

Refer this link for download and example

http://msdn.microsoft.com/en-us/library/dd901589(v=vs.95).aspx

To create a Deep Zoom image

Download and install Deep Zoom Composer.
Start Deep Zoom Composer and create a new project.
In the Import workspace, click Add image and add a high-resolution image to the project.
Click the Compose workspace.
On the Images tab, drag the image onto the artboard.
Size the image as needed.
Click the Export workspace.
Click the Custom tab.
In the Output type section, select Silverlight Deep Zoom.
In the Name box, type dzc_output.
In the Location box, specify a location.
In the Image settings section, select Export as a composition (single image).
Leave the other settings as their defaults.
Click the Export button to export the Deep Zoom image files.

<MultiScaleImage x:Name="deepZoomObject" Source="source/dzc_output.xml"

MouseEnter="DeepZoomObject_MouseEnter"

MouseLeave="DeepZoomObject_MouseLeave"/>

private void DeepZoomObject_MouseEnter(object sender, MouseEventArgs e)

{

// The ZoomAboutLogicalPoint method allows you to zoom and pan

// in the same step. The first parameter is the zoom (3x) and the

// third and fourth parameters are the respective x and y coordinates

// of the logical point to zoom around.

this.deepZoomObject.ZoomAboutLogicalPoint(3, .5, .5);

}

private void DeepZoomObject_MouseLeave(object sender, MouseEventArgs e)

{

double zoom = 1;

zoom = zoom / 3;

// This time the zoom is reversed (1/3) although the pan

// remains the same - zoom back out from the middle.

this.deepZoomObject.ZoomAboutLogicalPoint(zoom, .5, .5);

}

Regards

smr replied to balaji mogadali on 26-Dec-11 11:12 PM

hi

Intrigued by the thought of blurring an image to sharpen it? The process is called Unsharp Masking. It is the most widely used image sharpening method.

Assuming one starts from an image in an rgb byte array, the application does the following to produce a float array for the blur to work on.

//starting point

byte[] rgbValues; //the starting unblurred image

int numColumns; //the number of columns in the rgb image

//produce float[] array of Lightness values

float[] hslValues = HslSpace.RgbToHsl(rgbValues); //convert rgb image to

//HSL colorSpace

float[] lValues = new float[hslValues.Length / 4]; //storage to isolate

//Lightness values

int lIndex = 0;

//xferr just the L channel in hslValues to lValues array

for (int hslIndex = 0; hslIndex < hslValues.Length; hslIndex += 4)

lValues[lIndex++] = hslValues[hslIndex + (int)HSL.Lightness];

follow
http://www.codeproject.com/KB/WPF/ImageMagicImageSharpening.aspx

Jitendra Faye replied to balaji mogadali on 26-Dec-11 11:26 PM

For this use Deep Zoom

Once you have a Deep Zoom image, you need a Deep Zoom object such as MultiScaleImage to load it. The following shows how to create a MultiScaleImage in XAML.

XAML

<MultiScaleImage x:Name="deepZoomObject" Source="source/items.dzi" />

The following show how to create a MultiScaleImage in code.

MultiScaleImage myDeepZoomObject = new MultiScaleImage();
myDeepZoomObject.Source = new Uri("source/items.dzi");

The following illustration shows how the Deep Zoom image works. The image itself is available in full resolution at the bottom of the pyramid, and lower resolution versions down to 4x4 pixels are stored alongside the full resolution image. The images at each level of the pyramid are stored in 256x256 pixel tiles (indicated by the white lines in the images).

follow this link-

http://msdn.microsoft.com/en-us/library/cc645050%28v=vs.95%29.aspx#deep_zoom_examples