随笔 - 91  文章 - 1 评论 - 83 trackbacks - 0
<2008年8月>
272829303112
3456789
10111213141516
17181920212223
24252627282930
31123456

与我联系

搜索

 

常用链接

留言簿

我参与的团队

我的标签

随笔分类(125)

随笔档案(90)

国外技术网站

最新随笔

积分与排名

  • 积分 - 21407
  • 排名 - 1882

最新评论

阅读排行榜

评论排行榜

60天内阅读排行

Hi All

 

第一次发文章,不足之处请大家多多见谅。

 

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

 

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

 

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

 

 

Download Deep Zoom Composer 文件不大,需要有Silverlight运行时支持

 

好了,让我们来做一个demo吧:

 

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

 

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

嘿嘿...

 

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

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

 

 

 

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

 

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

 

 

 

呵呵,让我们看看生成后的工程文件:

 

工具为我们生成了N层的图片:

 

还有Silverlight工程文件:

 

点击下载生成的solution

http://files.cnblogs.com/blodfox777/DeepZoomProjectWeb.part1.rar

 http://files.cnblogs.com/blodfox777/DeepZoomProjectWeb.part2.rar

http://files.cnblogs.com/blodfox777/DeepZoomProjectWeb.part3.rar 

http://files.cnblogs.com/blodfox777/DeepZoomProject.rar

posted on 2008-08-05 19:23 LanceZhang 阅读(1783) 评论(12)  编辑 收藏 所属分类: ASP.NET客户端开发常见问题

FeedBack:
#1楼  2008-08-05 19:28 aspnetx      
不错
不知道矢量地图能不能派上用场
  回复  引用  查看    
#2楼  2008-08-05 19:51 Zhuang miao      
这个生成的文件真的很恐怖啊!!太大了~~昨天拿了几张图片做了个,生成了数十mb~
  回复  引用  查看    
#3楼  2008-08-05 20:24 reaper      
Deep zoom 太占CPU资源
  回复  引用  查看    
#4楼 [楼主] 2008-08-05 20:31 LanceZhang      
@Zhuang miao
嗯,是因为生成多层次的图片就能减少加载时间吧
  回复  引用  查看    
#5楼 [楼主] 2008-08-05 20:31 LanceZhang      
@reaper
呵呵,还好不是服务器,只是tool
  回复  引用  查看    
#6楼  2008-08-05 21:02 ocean      
这是一个非常好的工具,本身SL2是由一个Deep Zoom控件的,但是光有控件还不够,所有就又有一个工具来生成Deep Zoom控件所使用的图片。
@Zhuang Miao
这就叫做以空间换时间,现在的存储很便宜,但是用户希望自己的用户体验好,那么在放大缩小的时候,就需要快,生成这么多多层图片就是为了加载速度。所增加的额外存储是完全能够忍受的。

@reaper
这个我真无语了,这只是一个工具啊,运行一次就生成所有图片,单独找个机器来run不行吗?占用CPU资源多有什么关系吗?
  回复  引用  查看    
#7楼  2008-08-06 01:16 斯克迪亚      
很不错嘛,期待WPF和SL越来越强大。
  回复  引用  查看    
#8楼  2008-08-06 02:09 reaper      
@ocean
没表达清楚。。。
是用multiScaleImage.当drag图时IE的CPU占用率高的很。。。
  回复  引用  查看    
#9楼 [楼主] 2008-08-06 09:57 LanceZhang      
@reaper
呵呵,客户端的啊,是的,它开启了渐现和弹性效果,如果有办法关掉的话资源消耗会小一些,不过用户体验会降低
  回复  引用  查看    
#10楼  2008-08-06 11:36 Flyingis      
请问地图比例尺级数以及切片大小能够自己指定吗?
  回复  引用  查看    
#11楼 [楼主] 2008-08-06 12:08 LanceZhang      
@Flyingis
这个我也不清楚,我刚刚在产品组博客里问了,过两天估计就会回复:)
  回复  引用  查看    
#12楼  2008-08-15 14:06 克隆      
这个东西不错,标记
  回复  引用  查看    

标题  
姓名  
主页
Email (只有博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      


相关链接: