找论文网 > 计算机论文 > 计算机应用 >

基于Asp.net、SVG技术的WebGIS研究与实现(2)

宽为100 个坐标单位。进行基本地图操作时,均可以通过操作view box 得到理想的结果。地图缩放时将后2 个参数分别乘以(除以) 某个倍数就可以得到缩放后的窗口大小; 地图平移时, 后2 个参数不变, 修改前2 个参数, 指定新的起点坐标即可。地图复位时, 将view box 恢复为原始值即可完成复位操作。下面是地图还原功能的代码:
function OriginView() 
{
RecordViewBox();  
var docSVG = document.HUNNUWebGIS_SVG.getSVGDocu ment();
var eSVG = docSVG.getDocumentElement();
var originView = "0 0 600 500";
eSVG.setAttribute("viewBox",originView);
4.2  图层的控制
    由于在SVG地图浏览器中所操作的SVG地图是以分层的方式进行组织的,在该数据组织模式中,属于一个图层的地理特征数据组织在同一个分组元素下,且该分组元素的ID属性设置为图层的名称,这样对图层的显示控制就比较容易。首先通过图层名称在SVG DOM树中找到对应的分组元素,然后将该元素的style属性值设置为'display:none或display:inline,即可达到对图层的关闭与显示,如图4所示。
function hilite_elem(checkbox, element_name){
   var svgobj = document.embeds['HUNNUWebGIS_SVG']. getSVGDocument().getElementById(element_name);
                            if (!checkbox.checked){
                                     // 隐藏图层.
                                     svgobj.setAttributeNS(null,'style', 'display:none;fill-rule:evenodd');
                            } else {
                                     // 显示图层.
                                     svgobj.setAttributeNS(null,'style', 'display:inline;fill-rule:evenodd');
                            }
    }

图3 系统的主界面
4.3 简单的属性查询
    由于每一块图形区域都是用<path>路径表示的,可以在<path>中加入onclick事件,再用javascript语言编写onclick事件代码。当用鼠标单击图形区域时,就会弹出一个对话框,显示该区域的属性信息,如图5所示。
    
图4 城市区域图层隐藏效果                                   图5 属性查询
4.4 坐标的显示
    在每个<g>图层中加入onmousemove="changeText(evt)",通过javascript编写changeText(evt)函数,从而实现图形坐标的显示。
function changeText(evt)
{
   targetXtext=svgDocument.getElementById("XPos");
   targetYtext=svgDocument.getElementById("YPos");
   var XPos = evt.getClientX();
   var YPos = evt.getClientY();
 
   var newXPosText = svgDocument.createTextNode("X 坐标 : " + XPos);
   var newYPosText = svgDocument.createTextNode("Y 坐标 : " + YPos);
targetXtext.replaceChild(newXPosText,targetXtext.getFirstChild());
targetYtext.replaceChild(newYPosText,targetYtext.getFirstChild());
}
4.5 测量距离
    当图形中点的坐标捕获到时,测量两点之间的距离就很容易实现了,只需要编写一个函数实现两点之间距离的数学函数式: ,此时得到的距离是只是图形上的距离,如果要获得地物之间的实际距离,还需要除以比例尺。
5 结语
    系统使用Asp.net、SVG技术,结合SQL Server后台数据库技术动态的生成SVG图形;利用SVG、JavaScript和DOM技术很好实现了WebGIS客户端功能,结果表明该方法是可行的.对于更复杂的GIS功能实现,如空间分析、图形编辑等将是笔者以后进一步研究的方向。
参考文献
[1] 刘啸,毕永年.基于XML的SVG应用指南[Z].北京科海集团公司,2001,10—12
[2] W 3C. Scalable Vector Graphics 1.1 Specification.
http: //www. w3. org/T R/2003/R EC -SVG11- 20030114/,2003
[3] 宋国民,蒋敏等.基于SVG的地理信息可视化表达及网络发布的研究[J].信息仿真学报,2006,18(增刊1):301
[4] 冯艳杰.基于SVG的WebGIS实现技术[D].武汉:武汉大学,2005
[5] 史同广,张子民等.WebGIS实现模式及其技术评价[J].山东建筑工程学院学报,2005,20(1):92

共2页: 上一页 [1] 2


分形维度和Hurst指数的实验分析
基于ASP.NET技术的企业办公自动化系统的设计
工商管理 | 工科论文 | 财务管理 | 管理学 | 公共管理 | 财政税收 | 证券金融 | 会计审计 | 计算机 | 法律论文 | 医药学 | 汉语言文学
社会论文 | 工科论文 | 理科论文 | 文化论文 | 艺术论文 | 文学论文 | 哲学论文 | 政治论文 | 英语论文 | 写作指导 | 计算机应用
www.zlunwen.com 找论文网 ® 版权所有 网站地图