[Deepzoom 3] deepzoom application is created.

[Deepzoom 3] deepzoom application is created.
Zhou yinhui

Today we will introduce how to create a deepzoom application. If you have used deepzoomcomposer, you will find the "createcollection" option when exporting in deepzoomcomposer. It is determined whether you export an integral graph or an image set. For details about how to export an integral graph, refer to deep zoom composer (Step by Step | more pictures) (cool + Yes) This article Article , Well written ( I suggest you read it, because I will omit the duplicate content. ). The image set is described below.
Unlike exporting an integer, you cannot use the following method:
< Multiscaleimage
X : Name = "Msi"
Viewportwidth = "1.0"
Source = "/Xxxx/info. bin" Mouseleftbuttondown ="Msi_mouseleftbuttondown" Mouseleftbuttonup = "Msi_mouseleftbuttonup" Mousemove = "Msi_mousemove" />
Replace info. bin with items. bin. You will find this file in the exported file, which indicates that you export a collection.
Run your Program You can see a collection of images shown there, but unfortunately there is no interaction. Before that, let's take a lookMultiscaleimage(I don't know if my Silverlight SDK version is incorrect. There are no comments on the key attributes, methods, and events of multiscaleimage, so it is necessary to list my understanding of these attributes, methods, and events)
Source: The file exported by deepzoomcomposer (a single file is info. Bin and the collection is items. Bin)
Subimages: A subimage. If deepzoomcomposer exports a set, it stores each element in the set as a multiscalesubimage object. The sub-image operation depends on it.
Usingsprings: whether to enable the default animation (that is, the feeling of being elegant, cancellation is relatively stiff)
Viewport: the position of the view (which can be simply understood as the position of the eye, which is easier to understand with experience in 3D programming)
Viewportwidth: the width of the view. The wider the view, the closer the view is (the farther the picture is, or the image is reduced)
Aspectratio: aspect ratio.
Elementtologicpoint (): converts an element coordinate (physical coordinate) to a logical coordinate (the element coordinate is the normal coordinate we usually call, and the logical coordinate is the 0, 0 point in the upper left corner of the element, the relative coordinates of in the lower right corner)
Logictoelementpoint (): opposite to the above.
Zoomaboutlogicpoint (Double, double, double): scales by logical coordinates. The first parameter specifies the scaling increment, and the last two Parameters specify the scaling center.
Motionfinished event: the animation ends (or the animation ends after you operate an image or subgraph)

Subgraphs:
Each subgraph is a multiscalesubimage object, which is in the subimages attribute of multiscaleimage

How to move the subgraph position:
You can specify the position of a sub-graph by specifying the viportorgin attribute. For example
Subimage. viportorgin = new point (x, y );
So if you want to arrange the sub-image in WPF in the same way as the grid element, there is no way to calculate x, y one by one and then specify it.

How to scale a subgraph:
You can control it through the viewportwidth attribute of the subgraph. The larger the value, the smaller the subgraph.

How to show or hide a subgraph:
There is no visibility or related properties, but you can achieve it by setting its opacity (opacity.

How to obtain the position and size of a specified subgraph (rect)
Refer to this method: Private Rect getsubimagerect (multiscaleimage MSI, Int Index)
{
If (Index <   0   | Index > = MSI. subimages. Count)
{
ReturnRect. empty;
}

Multiscalesubimage Image = MSI. subimages [Index];
Double Scaleby =   1   / Image. viewportwidth;

Return   New Rect ( - Image. viewportorigin. x * Scaleby,
- Image. viewportorigin. Y * Scaleby,
Scaleby,
( 1   / Image. aspectratio) * Scaleby );
}

How to obtain the subgraph at the corresponding position based on the X and Y coordinates:
Refer to this method: Private   Int Getimageindexfromposition (multiscaleimage MSI, point pt)
{
PT = MSI. elementtologicalpoint (PT );

For ( Int I =   0 ; I < MSI. subimages. Count; I ++ )
{
Multiscalesubimage Image = MSI. subimages [I];
Double Scaleby =   1   / Image. viewportwidth;
Rect imagerect =   This . Getsubimagerect (MSI, I );
If (Imagerect. Contains (PT ))
{
ReturnI;
}
}

Return   - 1 ;
}

I believe that with this knowledge, we can make a good result. Haha: How to group subgraphs will be explained in the subsequent articles in this series. Thank you.