电子地图组件毕业设计论文内容.docx
《电子地图组件毕业设计论文内容.docx》由会员分享,可在线阅读,更多相关《电子地图组件毕业设计论文内容.docx(53页珍藏版)》请在冰豆网上搜索。
电子地图组件毕业设计论文内容
1.绪论
本课题的主要任务是设计一种多引擎地图服务组件,实现在一个组件中集成多种地图服务调用。
随着谷歌对其地理信息服务的开放,国内的搜狗地图、XX地图、51地图等地图服务商也相继开放了应用程序编程接口(简称API),地图服务已成为WEB开发中的常见部分。
用户们可以通过网站进行地理信息查询,随着用户的需
求越来越多,地图的功能也随之增多,并且不同网站也各自推出自己的地图服务,有的是自主开发的,有的是借助其他网站发布的API来开发的,他们各自有各自的特点,来满足不同用户的需要。
但是,各个网站有各自的特点,它们每个都不是最全面的,比如,谷歌地图在卫星图片实景地图方面的优势以及XX地图在公交导航方面的特色,用户想查询卫星照片,在谷歌地图上有,但XX地图上却没有,可是用户不知道,用户只能输入不同的网站来寻找该功能,以满足它的需求,这无外乎浪费了用户的时间。
所以开发一个多版本的地理信息系统组件是必须的,这就是本课题的主要任务。
设计题目:
XX地图、soso地图及整体框架的地理信息系统组件的设计与实现
实现的目标:
(1)设计出XX和soso的地图服务组件。
(2)设计出一个多版本的地理信息系统组件框架,即一个外部脚本js,在js内编写可以调用已存在的地图服务应用页面的函数。
(3)将XX和soso的地图服务组件整合到多版本的地理信息系统组件框架中,基本实现多版本的地理信息服务。
设计描述:
一个多版本的地理信息系统组件可以任意调用不同网站的地图服务,用户可以简单方便的调用需要的地图服务,这样既提高了效率,又满足了客户多样的需求。
2.需求分析
现如今谷歌、搜狗地图、XX地图、51地图等地图服务商相继开放了应用程序编程接口(简称API),并且公布了大量的事例代码和参考类,帮助程序员可以很好的理解与应用。
不过对于一些人来说,这些东西既浪费了很多的时间和又耗费个人的精力。
所以为追求简化各种地图服务的学习与编辑,我在此设计出一种多引擎地图服务组件,避免了程序员将时间浪费在学习各种地图服务上,也更好的提供多种版本地图帮助程序员进行选择。
地图服务应用主要应有以下几个方面:
1、搜索服务,即地址搜索、公交搜索、驾车搜索。
对于一些旅游网站,城市网站都提供一些地图搜索服务页面,可以详细的了解当地情况。
2、地图定位,目前大多数介绍地址信息的网页上,除了文字描述地址和地图截图显示地址这样单调的介绍方法,很少用到动态地图。
地图定位一般需要坐标定位服务或地址搜索服务。
组件设计的基本要求:
1、组件要有良好的兼容性。
现如今的网站服务平台多种多样,有的平台用php动态页面,有的用jsp动态页面,有的用asp动态页面。
为了兼容于这些平台,组件框架是以脚本编写,调用的地图服务应用页面是以静态页面html编写。
2、组件的应用要简单,便捷。
本课题的设计目的就是简化各种地图服务的应用,简单的组件服务调用可以使程序员轻易理解与使用,不必浪费过多的时间与精力去深入研究。
3.总体设计
对于“XX地图、soso地图及整体框架的地理信息系统组件的设计与实现”这一课题我们需要掌握以下几个技术:
1.JavaScript,这是一种能让你的网页更加生动活泼的程式语言,也是目前网页中设计中最容易学又最方便的语言。
JavaScript可以使网页的功能更强大,人机交互更简单。
对于本课题的设计中,这是一个十分重要的语言。
2.超文本标记语言,即HTML(HypertextMarkupLanguage),是用于描述网页文档的一种标记语言。
在设计组建中,把静态网页作为地图应用程序的载体,更好的调用地图服务,兼容性强。
3.地图API是一种通过JavaScript(或其他语言)将地图嵌入到网页的API。
该API提供了大量实用工具用以处理地图,并通过各种服务向地图添加内容,从而能够在网站上创建功能全面的地图应用程序。
(有关本课题的详细信息,请登录
通过以上3种技术,我将完成XX地图、soso地图及整体框架的地理信息系统组件的设计与实现。
具体步骤如下:
首先我将根据需求分析设计出坐标搜索,地址搜索、公交导航、驾车导航4种地图服务功能组件。
然后利用javascript编写外部脚本(即整体框架)封装地图服务组件。
最后进行修改,使外部脚本可以传递参数和地图服务组件可以接收参数。
4整体框架设计
整体框架设计(即外部脚本jb.js)部分代码如下:
functionmapapply()
{//XX地图
this.baiducity=function(id,city)
{varstyle="width:
100%;height:
100%";
varsrc="baiduzb.html?
city="+city;
varht="style="+style+"src="+src+">";
document.getElementById(id).innerHTML=ht;
}
//soso地图
this.sosozb=function(id,x,y,s)
{varstyle="width:
100%;height:
100%";
varsrc="sosozb.html?
x="+x+"&y="+y+"&xx="+xx+"&s="+s;
varht="style="+style+"src="+src+">";
document.getElementById(id).innerHTML=ht;
}
}
这是我设计的地理信息系统组件的整体框架:
通过javascript编写外部带参函数,简单封装地图服务组件,由document.getElementById(id).innerHTML语句改写
varmap=newBMap.Map("container");//创建地图实例
varpoint=newBMap.Point(116.404,39.915);//创建点坐标
map.centerAndZoom(point,15);//初始化地图,设置中心点坐标和地图级别
图5.1-1地图示例
下面将分步介绍:
准备页面
设置样式,使地图充满整个浏览器窗口:
html{height:
100%}
body{height:
100%;margin:
0px;padding:
0px}
#container{height:
100%}
引用XX地图API文件
创建地图容器元素
地图需要一个HTML元素作为容器,这样才能展现到页面上。
这里我们创建了一个div元素。
命名空间
API使用BMap作为命名空间,所有类均在该命名空间之下,比如:
BMap.Map、BMap.Control、BMap.Overlay。
创建地图实例
varmap=newBMap.Map("container");
位于BMap命名空间下的Map类表示地图,通过new操作符可以创建一个地图实例。
其参数可以是元素id也可以是元素对象。
注意在调用此构造函数时应确保容器元素已经添加到地图上。
创建点坐标
varpoint=newBMap.Point(116.404,39.915);
这里我们使用BMap命名空间下的Point类来创建一个坐标点。
Point类描述了一个地理坐标点,其中116.404表示经度,39.915表示纬度。
地图初始化
map.centerAndZoom(point,15);
在创建地图实例后,我们需要对其进行初始化,BMap.Map.centerAndZoom()方法要求设置中心点坐标和地图级别。
地图必须经过初始化才可以执行其他操作。
5.2坐标搜索服务应用组件设计
坐标搜索服务用于地图定位,在介绍地址的网页里使用坐标搜索服务组件,可以让用户更好的查询地址,了解具体位置。
在这一组件里要有2个基本参数,即坐标点x,y,用于对地图定位,另外还在该点上创建一个定位图标。
为方便程序员,我还添加了一个地图缩放级别的参数,可以根据需求进行设置。
以下是XX坐标搜索服务应用组件(baiduzb.html)和soso地图坐标搜索服务应用组件(sosozb.html)的代码和示例:
XX地图坐标搜索(baiduzb.html)的代码:
XX综合坐标搜索
#container{height:
100%}//设置页面尺寸
//获取API
paraObj[j.substring(0,j.indexOf("=")).toLowerCase()]=j.substring(j.indexOf("=")+1,j.length);