没有合适的资源?快使用搜索试试~ 我知道了~
首页Google+Maps与Ajax在Java+Web集成地图信息
Google+Maps与Ajax在Java+Web集成地图信息
需积分: 10 27 浏览量
更新于2023-05-26
评论 1
收藏 400KB DOC 举报
Google+Maps与Ajax在Java+Web集成地图信息Google+Maps与Ajax在Java+Web集成地图信息
资源详情
资源评论
资源推荐

基于 Google Maps 与 Ajax 在 Java Web 应用程序中集成地图信息(上)
一、引言
当今,交互式的地图日益流行于现代 应用程序中。而且,在这方面的确存在大量的潜在的用户:房地产和旅游业就是
两个很明显的领域;交互式的地图能够提供实时的附加值,而且还有其它许多功能。然而,尽管今天许多的 应用程序都能够
充分利用集成式地图软件所带来的优点,但是许多开发团队却经常选择避开集成具有完整功能的地理数据库系统所导致的复杂性。
诚然,地图点击软件已经上市多年;然而,真正具有交互功能的地图(实时地与服务器端进行交互)却一直被认为是相当复杂的,
直到现在也是如此。
两种最近出现的技术— 与 ,使得在上述领域的开发相对容易多了。在本文中,我们将讨论如何在你的
应用程序中加入动态的交互式地图功能—以 实现 接口,以 提供与服务器端的实时交互。本小系列(上
下篇)意在对 和 这两个框架作快速入门性介绍,使你能够快速而容易地创建自己的交互式地图程序。
二、Google Maps 简介
在本篇中,我们将讨论如何使用 把一个具有丰富特征的地图集成到你的应用程序中。 是一种
易于使用的 ,它能够使你把交互式地图直接嵌入到你的应用程序的 页面内部。并且我们将会看到,你会很容易地
扩展它以便使用 技术集成实时的服务器请求。
另一方面, 入门是很容易的。不需要任何下载;你仅需要注册一下以取得一个使用这种 的密钥即可,也不存
在相应的收费问题。但是,你需要提供你的网站的 ;并且,当你的应用程序发布于一个网站上时,你的密钥将仅使用这个 工
作。这种限制的一个恼人之处是,你需要针对你的开发或测试机器建立一个专门使用的密钥:为了实现本文的示例代码,我不得不创
建一个相应于 ! !" 的特定的密钥。
一旦你拥有了一个有效的密钥,你就可以开始使用 。让我们先从一些简单的问题入手:在我们的 页面上显示
一幅地图。假定你已受命于 #$ 的旅游部门构建一个关于 #$ 地区的许多旅游景点的宣传网站,特别是关于它的著名的温泉
浴。注意:在我们的示例中,既然 #$ 很难在当前地图中找到,那么,我们不妨显示一幅 %&$'(一个南太平洋中部的
小岛国家)的地图。
尽管该 并不特别复杂,但是使用 也要求掌握一些基本的 知识。你还需要知道你想显示的地区的纬度
和经度。如果你不确定的话,你可以在互联网上查找这类信息,甚至是查阅一本地图集!
我们的第一个 Google Map 的完整的代码实现列举如下:
()*+,-.#/-0,123,*-*/-45!6
-$$#%17
("7
('7
("289:1,$$2-;1
$$:1"<:-=2 17
(7+9>(7
(:1"55""?

>:@:A@B;:.C#.1
;:117(7
(;:117
()D,*-D
E9$$'FGH
EF0,"FGGH
":$AF'9"$5#"$0;'F1"1GG<
"5,$F$$F2465I, 26 IG, IG<
J
J
KK7
(7
('7
(';$':1'FG1$9$':1$'FG17
('':1"1;:1'4A!<4A!17('7
(';7
("7
在此,首先要注意的是,该代码从 Google Maps 服务器取回实际的 JavaScript 代码。要使该代码
能够工作,你需要提供你的相应密钥。
(:1"55""?
>:@:A@B;:.C#.1
;:117
(7
接下来,我们看一下实际从服务器端下载地图的代码:
(;:117
()D,*-D
E9$$'FGH
EF0,"FGGH
":$AF'9"$5#"$0;'F1"1GG<
"5,$F$$F2465I, 26 L5IG, IG<
J
J
KK7
(7
在此,你创建了一个 A 对象,并提供了一个对你的页面中的一些元素的引用。在本示例中,我们引用了页面 '; 部分的元
素。你需要提供给地图一个有效的纬度和经度以及缩放级别。缩放级别越高,地图将显示得越详细。

能够与大多数现代浏览器的最新版本良好地协同工作。不过,通过使用 0,"FG方法来确保使所
有的浏览器尽可以保持一致是一种良好的编码实践。
最后,在页面的 body 部分,我们显示该地图。地图的大小和形状都来自于相应的 HTML 元
素。当页面加载(经由 onload 事件)时地图被初始化。另外,当用户离开页面时,调用 GUnload()
方法(经由 onunload 事件)—它会清除地图的数据结构以避免发生在 Internet Explorer 中的内存漏
洞问题。
(';$':1'FG1$9$':1$'FG17
('':1"1;:1'4A!<4A!17('7
(';7
最终的结果地图显示于图 6 中。
M
图 65一幅简单的地图
三、平移与缩放
现在,既然我们能够成功地显示一幅地图,那么接下来,让我们试着添加一些缩放功
能。Google Maps API 允许你在你的地图上加入一些不同的控件,包括平移与缩放工具,一个地
图比例尺,还有一组按钮允许你改变地图和卫星之间的观察位置。在我们的示例中,我们要添
加一个小型平移/缩放控件和一个“概括地图”控件—这将放置一个小型的可折叠的概括性地图。你
可以使用 addControl()方法来添加这些控件,如下所示:

E9$$'FGH
EF0,"FGGH
":$AF'9"$5#"$0;'F1"1GG<
"5,$F$$F2465I, 26 L5IG, IG<
"5'',$F$",$FGG<
"5'',$F$+,$FGG<
J
J
我们的新的地图展示于图 A 中。
M
图 A5一幅带有一些控件的地图
四、在地图中加入标记
并不仅仅是显示一幅地图;你还能够配置更具动态的地图。为此,你需要在你的地图中添加“;N(覆盖
图)。+; 是一些对象,它们被显示为地图上的某些位置,并且用户能够与其进行交互。; 的一个典型的使用是把一个标
记放在一个给定位置以指示一些特殊位置或地址。
现在,让我们在地图上添加一个简单的标记。我们想把一个标记显示在 Elbonia 地区的一个特
定的旅游景点上面。在取得该点的纬度和经度后,我们创建一个新的 GMarker 对象并且使用
addOverlay()方法把它添加到地图中:
E9$$'FGH

EF0,"FGGH
":$
AF'9"$5#"$0;'F1"1GG<
"5,$F$$F2465I, 26 L5IG, IG<
"5'',$F$",$FGG<
"5'',$F$+,$FGG<
$:$$F2465A , 26 I5AAG<
"B:$BF$G<
"5''+;F"BG
J
J
在我们的示例中,当一个用户点击我们的标记时,我们想显示一些细节信息。我们仅把一个监
听器添加到标记上并且调用 openInfoWindowHtml()方法—它能够通过一个文本气泡窗显示一段
HTML 消息。
"B:$BF$G<
"5''+;F"BG
#$5''$F"B, 1B1, E9$$FGH
"B5$$E$'/"F1
'
1G<
JG<
现在,既然我们已经了解了有关 的基本知识,那么接下来,让我们来看一下如何把一幅 地图集成到一个
服务器端应用程序中。
五、AJAX 简介
是 所依赖的背后技术。它也是我们在一个动态的 应用程序扩展和集成我们的 所使用的技
术。 代表“异步 和 ON。从根本上来看, 是一种技术;它支持使用 代码把一个请求发送到一个服务
器端,检索一些响应数据F通常以 O 格式,相应于 中的“ONG,处理该数据,并相应地更新 页面。其中的第一个“N代表“异
步”; 请求能够在后台向服务器发送一个请求而不会中断用户的当作操作。当结果到达客户端浏览器时,调用一个回调函数来处理
该数据并动态地更新屏幕。在每一次更新过程中,不必重载整个屏幕,从而实现了一种更为平滑和更快速的用户体验。
Ajax 技术的核心体现在 XMLHttpRequest 类。
($9:11
;:117
8:$O/89FG<
(7
剩余63页未读,继续阅读

















web_killer
- 粉丝: 1
- 资源: 39
上传资源 快速赚钱
我的内容管理 收起
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助

会员权益专享
最新资源
- Xilinx SRIO详解.pptx
- Informatica PowerCenter 10.2 for Centos7.6安装配置说明.pdf
- 现代无线系统射频电路实用设计卷II 英文版.pdf
- 电子产品可靠性设计 自己讲课用的PPT,包括设计方案的可靠性选择,元器件的选择与使用,降额设计,热设计,余度设计,参数优化设计 和 失效分析等
- MPC5744P-DEV-KIT-REVE-QSG.pdf
- 通信原理课程设计报告(ASK FSK PSK Matlab仿真--数字调制技术的仿真实现及性能研究)
- ORIGIN7.0使用说明
- 在VMware Player 3.1.3下安装Redhat Linux详尽步骤
- python学生信息管理系统实现代码
- 西门子MES手册 13 OpcenterEXCR_PortalStudio1_81RB1.pdf
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈



安全验证
文档复制为VIP权益,开通VIP直接复制

评论0