设置初始的 Google Map
我希望可通过 http://localhost:9090/trip/trip/plan 访问旅行计划页面。这意味着将一个 plan 闭包添加到 grails-app/controllers/TripController.groovy 中，如清单 8 所示：
清单 8. 设置控制器
class TripController {
def scaffold = Trip
def plan = {}
}
def scaffold = Trip
def plan = {}
}
由于 plan() 不是以 render() 或 redirect() 结束，根据约定优于配置原则，显示的将是 grails-app/views/trip/plan.gsp。用清单 9 中的 HTML 代码创建文件。(要回顾这个 Google Map 的基础原理，请参阅 “Grails 服务和 Google 地图”)。
清单 9. 设置初始 Google Map
<html>
<head>
<title>Plan</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=YourKeyHere"
type="text/javascript"></script>
<script type="text/javascript">
var map
var usCenterPoint = new GLatLng(39.833333, -98.583333)
var usZoom = 4
function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"))
map.setCenter(usCenterPoint, usZoom)
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
}
}
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div class="body">
<div id="search" style="width:25%; float:left">
<h1>Where to?</h1>
</div>
<div id="map" style="width:75%; height:100%; float:right"></div>
</div>
</body>
</html>
<head>
<title>Plan</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=YourKeyHere"
type="text/javascript"></script>
<script type="text/javascript">
var map
var usCenterPoint = new GLatLng(39.833333, -98.583333)
var usZoom = 4
function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"))
map.setCenter(usCenterPoint, usZoom)
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
}
}
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div class="body">
<div id="search" style="width:25%; float:left">
<h1>Where to?</h1>
</div>
<div id="map" style="width:75%; height:100%; float:right"></div>
</div>
</body>
</html>
如果一切正常，在浏览器中访问 http://localhost:9090/trip/trip/plan 将看到如图 3 所示的界面：
图 3. 一个普通的 Google Map
有了基本的地图之后，现在应该添加两个字段，分别用于出发地机场和目的地机场。
