MAPEASY数字地图的优化

E-mail: xej@cc.net.cnISSN 100- 3044Computer Knowledge and Technoloy电堕知识与技术htp:/:/w/w dnzs.net.cnVol.6.No.13, May 2010, p.3426-3428Tel:+86 -551-5690963 5690964MAPEASY数字地图的优化张雯雾,刘莲花了,肖娟'(1.湘南学院计算机系,湖南郴州430002.华南师范大学增城学院计算机系,广东广州511363)摘要:介绍了基于预生成的数字地图技术及MapEasy开源项目,针对MapEasy只支持正方形地图和内存泄露的问题,对MapEay进行了相应优化,提供了对矩形地围的支持,降低了内存使用量。并用一个简单的地围实例说明了使用MapEasy制作教字地围的方法。中團分类号:TP393文献标识码:A文章编号:1009- -3044(2010)13- -3426 -03Optimization of MAPEASY Digital MapZHANG Wen-Fen', LIU Lian-Hua2, XIAO Juan'(1.Faculty of Computer, Xiangnan University, Chenzhou 423000, Chin; 2.Faculty of Computer, Zengcheng College of SCNU,Guangzhou 511363, China)square map model and has memory leak problem. To counter these problems, this paper carried on the corresponding optimizaion to pro-vide rectangular map support and reduce memory usage. Finally, a simple map example is given to ilustrate the applications of MapEasydigital map.Key words: WebGIS; digial map; pre- generation tchnology; MapEasyWebGIS是在Intermet或Intranet网络环境下的一种兼具存储、处理、分析.显示与应用地理信息的计算机系统"。WebGIS 的应用日益广泛,除了常见的网上电子地图查询之外,还因其可以直观地表示与地理位置相关的各种数据而应用于通信、水利、环境等专业软件中。目前,实现WebGIS地图发布主要有2类技术:一类是以ArcIMS为代表的矢量地图动态生成技术;另一类是近年来在公共地图服务领域广泛应用的基f瓦片方式的地图预生成技术.如Google Map, 5lditu, Mapbar等叫。在Google Maps推出之前,网络数字地图主要使用传统的WebGIS技术,而GoogleMaps则采用地图预生成(又称地图切片)技术及Ajax客户端编程技术实现，这种实现方案响应速度快、用户体验好服务器负简轻,并且不依赖专业GIS服务平台。目前,绝大多数网络数字地图都采用了类似技术方案。基于此类技术的数字地图开源项目也应运而生,比较薯名的有MapEasy".OpenLayers等。本文将针对MapEasy的不足对其进行了一些优化,将地图形状从正方形扩展为矩形并且减少了内存使用量,最后用一个简单的地图实例说明了使用MapEasy制作数字地图的方法。1关键技术与MapEasy简介网络数字地图系统--般采用B/S结构.即把浏览器作为客户端程序。传统的WebCIS方式是实时生成地图的,即客户端每产生- - 次地图请求,服务器都重新生成相应的地图图片发送到客户端。这意味着每次拖动和缩放地图都需要服务器端的GIS软件实时生成图片。这种方式的响应速度慢、服务器负载重。地图预生成技术则把预先生成的地图切割成许多大小相同的小图片存放在服务器硬盘目录下.地图以链接图片的方式在浏览器端拼接和显示,这些小图片通常被称为“瓦片"。每次拖动和缩故地图时,由客户端的JavaSeript脚本来计算所需显示的瓦片及其显示位置,并链接服务器目录下存放的相应瓦片,最终在浏览器窗口中显示出地图。地图的每个缩放级别对应了不同比例尺的地图.放大的级别越高地图越清晰组成地图的瓦片数目就越多。例如Coogle地图,现共有20个缩放缴别,每个级别的完整地图都是由此级别的瓦片拼合而成,相邻级别的地图大小相差4倍，即每张较低级别的瓦片对应4张较高级别的瓦片。若第1级地图的瓦片数为1,则后续级别的瓦片数分别为4.16.64... ,这种瓦片组织形式又被称为瓦片金字塔模型。Ajax是Asynchronous Javascript and XML的缩写，是几项技术以新的方式组合而成。主要包括JavaSeript XML、DOM等。JavaScript是一种基于对象和事件驱动的Web浏览器端脚本语言,可以用它来响应对Web页面的操作并通过DOM操纵网页元素、通过XMLHtpRequest对象读取服务器数据。AJAX让开发者在浏览器端更新网页内容而不必刷新页面,使基于浏览器的应用程序响应速度更快、更具交互性。中国煤化工收稿日期:2010-03-07THCNMHG基金项目:湖南省教育厅科研基金资助项目(09C921)作者简介:张雯雾(1976-),女,湖南澧县人,讲师,硕士研究生,主要研究方向为智能算法;刘莲花(1982-),女,江西赣州人,助教,硕士研究生,主要研究方向为困形围像处理;肖娟(1982- ),女,湖南永兴人,讲师,学士,主要研究方向为混威形式。3426 .软件设计开发.......本栏目责任编翼:谢媛媛第6卷第13期(2010年5月)Computer Knowedge and Technlogy电脑知识与技术MapEasy是基于瓦片预生成技术的开源项目，实现了基本的数字地图功能和简单地物标注等，是一个轻量级的客户端JS库。MapEasy只支持正方形地图模型,没有提供对矩形地图的支持,另外MapEasy占用内存较多,并且随着对地图拖放等操作的增加,内存使用量会快速上升,本文将针对这些不足进行改进。2 MapEasy的优化本文使用的MapEasy版本为mapapi0.4alpha,可在网络上下载其压缩包,解压后的文件夹作为网站根目录。程序均在IE6.0 中测试通过。2.1对矩形地图的支持在MapEasy中.常量MapModelLirsiZoomTileNum为地图模型第1个缩放等级的瓦片敷,其默认值为1,可以在定制地图时根据需要设置。其它等级地图的总瓦片数则用缩放缴别、相邻二级之间的缩放比例及MapMoeLisfstooTilNiuemn计算得出。变量bor-derTilesNum为地图某-缩放级别的边缘瓦片数,由此级地图的总瓦片数开平方根得出,即borderTilesNum既是组成此级地图的瓦片的行数，也是瓦片的列数。这就决定了MapEasy的地图模型只支持正方形地图(当瓦片为正方形时)。为支持矩形 地图,需要增加2个常献,分别表示地图模型第1个缩放等级每行和每列的瓦片数.如MapMoelsrsloomBordereTileNumX和MapMedeil.rstZoomBorderTileNumY。还需增加2个变量,分别表示地图其它缩放等级每行和每列的瓦片数,如border-TlesNumX和borderTilesNumY。具体的修改步骤如下:1)修改MapModeljs文件①增加2个地图模型常量:MapModel.frslZoomBorderTileNumX= 1;MapModel.irstZoomBorderfileNumY = 1;②将Zoom函数中定义边缘片數this brderTileNuem的1行用以下2行替换:thisborderTilesNumX;thisborderTilesNumY;③将Zoom函数中的"“his brderTIlesNum = MthsgqtstilesNu);"用以下2行替换:this.borderTilesNumX =Math.pow(MapModel.scalePara, (this.Jevel - 1)*MapModel.irsZoomBorderTileNumX;this. borderTilesNumY =Math.pow(MapModel.scalePara, (hislevel - 1)*MapModel.fistoomBorderTileNumY;④将Zoom函数中所有的borderTilesNum按情况分别替换为borderTilesNumX 或者borderTilesNumY。⑤将Zoom函数中的函数getBorderTilesNum用以下2个函数代替:,this.getBorderTilesNumX = function0 {retum thisborderTilesNumX;this.getBorderTilesNumY = unction0 {retum this,borderTilesNumY;2)修改文件apEvent.je.DragActionjs和ExrToolsWidetjs,将其中的函数名getBorderTilesNum 替換为getBorderTlesNumX或者getBorderTilsNumY。2.2对内存使用f的优化在MapEasy数字地图中,随着对地图拖放等操作的增加,内存使用量会快速上升.这是因为某些不再使用的变量或对象所占的内存没有被释放。这种现象大多是由循环引用引起的.循环引用是指IE浏览器的COM组件产生的对象实例和网页脚本引擎产生的对象实例相互引用。IE使用引用计数的方法来释放内存,只有当一个变量或对象的引用计数为零时,其内存才能被释放.而相互引用会使得双方的引用计数都不为零从而导致其内存不能释放。一般的解决方法是:对其中一个对象直接赋null值以破坏引用链。在拖放MapEasy地图时,脚本程序主要的工作是对地图图片的重新拼装和地图上各标记的重新显示,因此重点对这2部分代码进行了修改。具体修改步骤为:1)修改MapPaneWidgetjis文件,在paintMap函数的末尾增加如下代码:oldTileNodes = null;tile =null;tilelmage =null;setTimout(CollectGarbage, 1);2)修改ExToolsWidgtjs文件.在适当的位置增加如下代码:icon =nll;mapDiv =null;中国煤化工markerDiv =nul;markerShadowDiv =nul;MHCNMHG3地图实例本节将以一个简单的电子地图实例来说明MapEasy的应用方法。实现步骤如下:本栏目责任编辑:邀媛媛........软件设计开发..3427.Computer Knowledge and Technology电脑知识与技术第6卷第13期(2010年5月)1)准备图片素材一组2级缩放的地图瓦片,第1级2张,第2级8张,共10张。瓦片大小为256x256像素。2)瓦片的存放与编号在站点根目录下新建mapimages文件夹,用来存放瓦片图像文件。在此文件夹下再新建zoom_ 1、zoom 2二个文件夹。将第1级的瓦片复制到zoom, 1中,并对瓦片编号,用此编号作为瓦片的文件名。编号表示了瓦片在拼成此级地图全图时的摆放位置,格式为x y,其中x表示瓦片位于本级地图全图中第几行,y则表示列数,均从0开始编号。3)将网站根目录下的网页demol.anoy,html作为本例的首页.需要舔加或修改的代码有: