Ajax支持的Google地图Mashup教程(3)
来源:百度文库 编辑:神马文学网 时间:2024/04/29 08:22:31
Ajax支持的Google地图Mashup教程(3)
作者: , 出处:Dev2Dev, 责任编辑: 叶江, 2007-06-13 14:59本文中将使用工具轻松构建终极的Hello World mashup:Google地图mashup……
Google 地图 API
Google地图和 Yahoo!地图(我们不会进一步讨论Yahoo!)均创建了可公开访问的JavaScript API,用于免费将地图嵌入随机的Web 站点。这形成了小规模的mashup Web 应用程序集,它们使用这些API来标绘地理位置,从芝加哥的 犯罪地点到全世界的AP 新闻发生地。 这种流行的模式是查询针对一组地址的服务,然后使用Google Map API映射这些地址,这也是我构建mashup所使用的方法。您会看到,这种实现方法简单直白,但是有两件事需要注意。
首先,浏览器的跨域安全功能似乎不利于用JavaScript 在浏览器中实现Google 地图 mashup。这是由于用户必须导航到托管REST 服务的网络域,该服务会生成一个地址列表。在该网络域中,将不允许浏览器请求http://maps.google.com 。Google 在其JavaScript 库中实现了一种解决方案,重载对于google.com 脚本的资源请求,以便将数据注入到浏览器中。
第二件事不是技术问题,而是商业问题。Google 拥有映射数据和API ,保留定义 服务条款的权利,Google 限制每个Web 站点的免费服务为每天50,000 请求。如果这是个问题,那么 付费服务 是没有限制的。为了实施这种使用策略,每个Web 站点都有一个惟一的API密钥,必须将其配置为可追踪站点的使用情况。获得该密钥是免费的,而且简单容易, 然后在HTML 页面的脚本源块中可以对它进行配置,如下所示(为简洁起见,截断了密钥):
从 REST 数据服务检索地理位置
既然已经具备了开发所用的工具箱,那么就该开始实现Ajax 支持的Google 地图mashup 了。本节将逐步介绍如何构造一个REST 服务,该服务通过地址指示位置。在下一小节中,我们将把REST 服务连接到Google 地图来创建mashup。
关于 REST 服务,要说的第一点是它很简单。本教程的内容和演示可以作为构建更复杂的mashup 的起点。因此,其中的 Hello World mashup 尽可能简单而去掉复杂性。为此, REST 服务是一个静态服务:位置是硬编码到HTML 页面中的。尽管这看似不灵活,但用一个动态服务很容易就可以代替整个方法。精通JSP、PHP或 Ruby on Rails 的开发人员可以用从数据库、Web 服务或其他技术中寻找方法来代替静态的HTML 服务。
REST 服务是在示例的getD2DSites.html 中实现的。请看一下这个文件,您会发现它只是JSON 格式的地址对象的序列化JavaScript 数组:
{"locations":
{"location":[
{"id": "WashingtonDC",
"city": "Washington DC",
"location": "Hilton Hotel, Tysons Corner",
"address": "7920 Jones Branch Drive",
"date": "May 2nd, 2007"
},
{"id": "NYC",
"city": "New York City",
"location": "Grand Hyatt New York",
"address": "109 East 42nd Street, NY 10017",
"date": "May 3rd, 2007"
},
etc...