交流。其中主要是silver2.0 beta的新特性的介绍和演示。其中的Deep Zoom Composer的演示给我留
下了深刻印象。当然大家可以从他本人的BLOG上了解更多的相关信息。而本文就是通过他在BLOG上的介绍
自己动手演练的一个成果。注(本文所用图片系本人宝宝照片)
当然本文只是初步功能的演示,相信园子里也有人做了这方面的介绍了。所以这里就不多说什么了。
本文中的C#源码是在网上找到的,因为有一定的通用性,所以这里就直接使用了。
相关代码如下:
1
public
partial
class
Page : UserControl
2![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
{
3
Point lastMousePos = new Point();
4![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
5
bool mouseButtonPressed = false;
6
bool mouseIsDragging = false;
7
Point dragOffset;
8
Point currentPosition;
9![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
10
public Page()
11![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
12
InitializeComponent();
13
deepZoomObject.MouseMove += delegate(object sender, MouseEventArgs e)
14![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
15
if (mouseButtonPressed)
16![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
17
mouseIsDragging = true;
18
}
19
lastMousePos = e.GetPosition(deepZoomObject);
20
};
21![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
22
deepZoomObject.MouseLeftButtonDown += delegate(object sender, MouseButtonEventArgs e)
23![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
24
mouseButtonPressed = true;
25
mouseIsDragging = false;
26
dragOffset = e.GetPosition(this);
27
currentPosition = deepZoomObject.ViewportOrigin;
28
};
29![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
30
deepZoomObject.MouseLeave += delegate
31![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
32
mouseIsDragging = false;
33
};
34![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
35
deepZoomObject.MouseLeftButtonUp += delegate
36![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
37
mouseButtonPressed = false;
38
if (mouseIsDragging == false)
39![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
40
if ((Keyboard.Modifiers & ModifierKeys.Shift) == ModifierKeys.Shift)
41![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
42
Zoom(0.5, lastMousePos);
43
}
44
else
45![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
46
Zoom(2, lastMousePos);
47
}
48![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
49
}
50
else
51![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
52
mouseIsDragging = false;
53
}
54
};
55![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
56
deepZoomObject.MouseMove += delegate(object sender, MouseEventArgs e)
57![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
58
if (mouseIsDragging)
59![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
60
Point newOrigin = new Point();
61
newOrigin.X = currentPosition.X - (((e.GetPosition(deepZoomObject).X - dragOffset.X) / deepZoomObject.ActualWidth) * deepZoomObject.ViewportWidth);
62
newOrigin.Y = currentPosition.Y - (((e.GetPosition(deepZoomObject).Y - dragOffset.Y) / deepZoomObject.ActualHeight) * deepZoomObject.ViewportWidth);
63
deepZoomObject.ViewportOrigin = newOrigin;
64
}
65
};
66![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
67
new MouseWheelHelper(deepZoomObject).Moved += delegate(object sender, MouseWheelEventArgs e)
68![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
69
e.Handled = true;
70
if (e.Delta > 0)
71![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
72
Zoom(1.2, lastMousePos);
73
}
74
else
75![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
76
Zoom(.80, lastMousePos);
77
}
78
};
79![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
80
KeyDown += delegate(object sender, KeyEventArgs e)
81![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
82
Point p = new Point((deepZoomObject.Width / 2),
83
((deepZoomObject.Width / deepZoomObject.AspectRatio) / 2));
84![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
85
switch (e.Key)
86![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
87
case Key.I:
88
case Key.C:
89
case Key.Add:
90
Zoom(1.1, p);
91
break;
92
case Key.O:
93
case Key.Space:
94
case Key.Subtract:
95
Zoom(0.9, p);
96
break;
97
case Key.Left:
98
case Key.A:
99
deepZoomObject.ViewportOrigin = new Point(deepZoomObject.ViewportOrigin.X
100
- (0.1 * deepZoomObject.ViewportWidth), deepZoomObject.ViewportOrigin.Y);
101
break;
102
case Key.Right:
103
case Key.D:
104
deepZoomObject.ViewportOrigin = new Point(deepZoomObject.ViewportOrigin.X +
105
(0.1 * deepZoomObject.ViewportWidth), deepZoomObject.ViewportOrigin.Y);
106
break;
107
case Key.Up:
108
case Key.W:
109
deepZoomObject.ViewportOrigin = new Point(deepZoomObject.ViewportOrigin.X,
110
deepZoomObject.ViewportOrigin.Y - (0.1 * deepZoomObject.ViewportWidth));
111
break;
112
case Key.Down:
113
case Key.S:
114
deepZoomObject.ViewportOrigin = new Point(deepZoomObject.ViewportOrigin.X,
115
deepZoomObject.ViewportOrigin.Y + (0.1 * deepZoomObject.ViewportWidth));
116
break;
117
case Key.R:
118
ArrangeIntoGrid();
119
break;
120
default:
121
break;
122
}
123
};
124
}
125![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
126
private void Zoom(double zoom, Point pointToZoom)
127![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
128
if ((zoom >= 1.0 && deepZoomObject.ViewportWidth > 0.05) || (zoom < 1.0 && deepZoomObject.ViewportWidth < 2))
129![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
130
Point logicalPoint = deepZoomObject.ElementToLogicalPoint(pointToZoom);
131
deepZoomObject.ZoomAboutLogicalPoint(zoom, logicalPoint.X, logicalPoint.Y);
132
}
133
}
134![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
135
//
136
// A small example that arranges all of your images (provided they are the same size) into a grid
137
//
138
private void ArrangeIntoGrid()
139![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
140
List<MultiScaleSubImage> randomList = RandomizedListOfImages();
141
int numberOfImages = randomList.Count;
142![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
143
int totalImagesAdded = 0;
144![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
145
int totalColumns = (int)Math.Sqrt(numberOfImages) + 1;
146
int totalRows = numberOfImages / (totalColumns - 1);
147![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
148
for (int col = 0; col < totalColumns; col++)
149![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
150
for (int row = 0; row < totalRows; row++)
151![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
152
if (numberOfImages != totalImagesAdded)
153![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
154
MultiScaleSubImage currentImage = randomList[totalImagesAdded];
155![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
156
Point currentPos = currentImage.ViewportOrigin;
157
currentImage.ViewportWidth = totalColumns;
158
Point futurePosition = new Point(-1.2 * col, -1.6 * row);
159![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
160
// Set up the animation to layout in grid
161
Storyboard moveStoryboard = new Storyboard();
162![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
163
// Create Animation
164
PointAnimationUsingKeyFrames moveAnimation = new PointAnimationUsingKeyFrames();
165![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
166
// Create Keyframe
167
SplinePointKeyFrame startKeyframe = new SplinePointKeyFrame();
168
startKeyframe.Value = currentPos;
169
startKeyframe.KeyTime = KeyTime.FromTimeSpan(TimeSpan.Zero);
170![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
171
startKeyframe = new SplinePointKeyFrame();
172
startKeyframe.Value = futurePosition;
173
startKeyframe.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(1));
174![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
175
KeySpline ks = new KeySpline();
176
ks.ControlPoint1 = new Point(0, 1);
177
ks.ControlPoint2 = new Point(1, 1);
178
startKeyframe.KeySpline = ks;
179
moveAnimation.KeyFrames.Add(startKeyframe);
180![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
181
Storyboard.SetTarget(moveAnimation, currentImage);
182
Storyboard.SetTargetProperty(moveAnimation, "ViewportOrigin");
183![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
184
moveStoryboard.Children.Add(moveAnimation);
185
deepZoomObject.Resources.Add(moveStoryboard);
186![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
187
// Play Storyboard
188
moveStoryboard.Begin();
189![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
190
totalImagesAdded++;
191
}
192
else
193![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
194
break;
195
}
196
}
197
}
198![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
199![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
200
}
201![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
202
private List<MultiScaleSubImage> RandomizedListOfImages()
203![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
204
List<MultiScaleSubImage> imageList = new List<MultiScaleSubImage>();
205
Random ranNum = new Random();
206![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
207
// Store List of Images
208
foreach (MultiScaleSubImage subImage in deepZoomObject.SubImages)
209![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
210
imageList.Add(subImage);
211
}
212![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
213
int numImages = imageList.Count;
214![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
215
// Randomize Image List
216
for (int i = 0; i < numImages; i++)
217![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
{
218
MultiScaleSubImage tempImage = imageList[i];
219
imageList.RemoveAt(i);
220![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
221
int ranNumSelect = ranNum.Next(imageList.Count);
222![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
223
imageList.Insert(ranNumSelect, tempImage);
224![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
225
}
226![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
227
return imageList;
228
}
229
}
230
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
2
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
3
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
4
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
5
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
6
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
7
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
8
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
9
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
10
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
11
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
12
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
13
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
14
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
15
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
16
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
17
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
18
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
19
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
20
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
21
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
22
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
23
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
24
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
25
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
26
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
27
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
28
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
29
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
30
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
31
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
32
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
33
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
34
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
35
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
36
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
37
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
38
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
39
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
40
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
41
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
42
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
43
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
44
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
45
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
46
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
47
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
48
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
49
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
50
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
51
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
52
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
53
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
54
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
55
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
56
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
57
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
58
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
59
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
60
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
61
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
62
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
63
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
64
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
65
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
66
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
67
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
68
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
69
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
70
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
71
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
72
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
73
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
74
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
75
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
76
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
77
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
78
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
79
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
80
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
81
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
82
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
83
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
84
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
85
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
86
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
87
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
88
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
89
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
90
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
91
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
92
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
93
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
94
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
95
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
96
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
97
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
98
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
99
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
100
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
101
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
102
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
103
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
104
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
105
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
106
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
107
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
108
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
109
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
110
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
111
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
112
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
113
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
114
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
115
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
116
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
117
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
118
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
119
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
120
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
121
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
122
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
123
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
124
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
125
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
126
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
127
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
128
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
129
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
130
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
131
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
132
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
133
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
134
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
135
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
136
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
137
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
138
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
139
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
140
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
141
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
142
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
143
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
144
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
145
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
146
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
147
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
148
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
149
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
150
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
151
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
152
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
153
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
154
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
155
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
156
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
157
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
158
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
159
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
160
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
161
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
162
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
163
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
164
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
165
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
166
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
167
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
168
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
169
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
170
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
171
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
172
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
173
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
174
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
175
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
176
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
177
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
178
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
179
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
180
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
181
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
182
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
183
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
184
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
185
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
186
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
187
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
188
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
189
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
190
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
191
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
192
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
193
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
194
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
195
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
196
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
197
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
198
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
199
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
200
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
201
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
202
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
203
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
204
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
205
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
206
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
207
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
208
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
209
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
210
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
211
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
212
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
213
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
214
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
215
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
216
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
217
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedSubBlock.gif)
![](https://www.cnblogs.com/Images/dot.gif)
218
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
219
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
220
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
221
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
222
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
223
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
224
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
225
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
226
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
227
![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
228
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
229
![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockEnd.gif)
230
![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
下面就是演示效果截图:
![](https://i-blog.csdnimg.cn/blog_migrate/41c942290a0ec15d780ac99bbbda9865.jpeg)
点击其中某个图像之后的效果:
![](https://i-blog.csdnimg.cn/blog_migrate/c04fb40270a7d0937e687b83be1c4c71.jpeg)
再放大后的效果:
![](https://i-blog.csdnimg.cn/blog_migrate/70864afb4d4c7de028e2506f3634b7a3.jpeg)
相关工具:
Deep Zoom Composer 使用截图:
![](https://i-blog.csdnimg.cn/blog_migrate/bd9a9faa4d683f67b49dc3593915d7b2.jpeg)
相关的源码 下载
Deep Zoom Composer 下载
其它相关链接:
黄继佳blog : http://blogs.msdn.com/jijia
DeepZoom 演示:
1. Hard Rock(Deep Zoom) http://memorabilia.hardrock.com/
2. 台湾博物院(目前在大陆无法访问) http://learnet.npm.gov.tw/silverlight