拼吾爱程序人生

大家用过Google earth或Baidu Map的都知道他们的电子地图可以支持 鼠标拖放、局部缩放等操作，又炫又酷，其原理就是在服务端准备了多个层次大小不同的图片，通过条件选择显示，其工作量大，非常复杂。

而如今，在Silverlight 2下，MS提供了Deep Zoom Composer工具（目前为独立的小工具，将会集成到下一个版本的Expression Blend中去）

能够仅仅通过鼠标点击便帮我们生成一个强大的10层电子地图，并连同Silverlight XAML代码：

附件: Deep Zoom Composer.jpg

Download Deep Zoom Composer 文件不大，需要有Silverlight运行时支持 好了，让我们来做一个demo吧：

1.首先用Deep Zoom Composer新建一个工程：

附件: Deep Zoom Composer Siverlight 1.jpg

2.大家可以看到，整个步骤只有 导入——制作——导出 三步 点击右边的“ADD Image”来添加我们准备好的图片，这里我准备的是分辨率高达一亿的中国地图：

附件: mapcn.jpg

嘿嘿...

附件: Deep Zoom Composer Siverlight 2.jpg

3.如果同时需要添加多张图片的话也是可以的，直接点击“add image”添加就行， 接下来我们开始制作，点击上面的“Compose”，进入制作界面，把我们已经添加的图片从右边拖到中间去，并调整好大小和位置。

注：这里只用了一张图片，如果用了多张的话依次拖入调整即可，还可以点击“Layer View”来调整层叠属性

附件: Deep Zoom Composer Siverlight 3.jpg

4. 好了，点击“Export”就可以输出Silverlight工程：

附件: Deep Zoom Composer Siverlight 4.jpg

点击“Preview in browser”就可以直接在浏览器中查看制作好的地图，拖拽效果+局部缩放+毛玻璃效果+弹性效果，如图：

附件: Deep Zoom Composer Siverlight 5.jpg

附件: Deep Zoom Composer Siverlight 6.jpg

附件: Deep Zoom Composer Siverlight 7.jpg

呵呵，让我们看看生成后的工程文件： 工具为我们生成了N层的图片：

附件: Deep Zoom Composer Siverlight 8.jpg

还有Silverlight工程文件：

附件: Deep Zoom Composer Siverlight 9.jpg
（文/blodfox777）

点击下载生成的solution：

附件: 下载地址
Silverlight栏目的最新浏览文章：
• 微软Expression Blend 3中文教程
• 使用Silverlight Toolkit绘制图表(上)--柱状图
• 使用silverlight构建一个工作流设计器(二十一)-增加标签（下）
• 使用silverlight构建一个工作流设计器(二十)-增加标签（上）
• 使用silverlight构建一个工作流设计器(十九)-规则与活动的交点的平滑移动
• 使用silverlight构建一个工作流设计器(十八)-持久化数据到数据库—服务器段功能实现
• 使用silverlight构建一个工作流设计器(十七)-持久化数据到数据库—设计webservices接口
• 使用silverlight构建一个工作流设计器(十六)-持久化数据到数据库—数据库结构
• 使用silverlight构建一个工作流设计器(十五)(缩放流程图)
• 使用silverlight构建一个工作流设计器(十四)(动态生成流程图片下载_下)
• 使用silverlight构建一个工作流设计器(十三)(动态生成流程图片下载_上)
• 使用silverlight构建一个工作流设计器(十二)(附源代码下载、在线演示)
• Silverlight Recipes: A Problem-Solution Approach, 2nd Edition
• 使用silverlight构建一个工作流设计器(十一)(附源代码下载、在线演示)
• 使用silverlight构建一个工作流设计器(十)(附源代码下载、在线演示)
• 使用silverlight构建一个工作流设计器(九)(附源代码下载、在线演示)