Question

我是新手，这个问题可能很简单，但请帮助。

我正在尝试在一个非常简单的谷歌地图脚本中集成一个搜索框。

1-我从这里成功复制了文件：From Info Windows to a Database: Saving User-Added Form Data 配置好，效果很好!!

现在我正在尝试将搜索框功能添加到现有代码中。基本上，我想整合这个：Place Search Box 进入上一段代码。

这样我就可以在将特定位置添加到我的数据库之前搜索地点（城市）。

谢谢大家！

Answer 1

您可以设置以下内容：

实施搜索地点。
获取重要数据（名称，地址，类型）自动使用此数据填充信息窗口。
在DB中编辑/保存数据。

代码：

// Create a marker for each place.
 markers.push(new google.maps.Marker({
 map: map,
 icon: icon,
 title: place.name,
 position: place.geometry.location
 }));

然后从链接添加自定义信息窗口/调整表单中的一些值，获取搜索结果。

var html = "<table>" +
"<tr><td>Name:</td> <td><input type='text' id='name'/> </td> </tr>" +
"<tr><td>Address:</td> <td><input type='text' id='address'/></td> </tr>" +
"<tr><td>Type:</td> <td><select id='type'>" +
"<option value='bar' SELECTED>bar</option>" +
"<option value='restaurant'>restaurant</option>" +
"</select> </td></tr>" +
"<tr><td></td><td><input type='button' value='Save & Close' onclick='saveData()'/></td></tr>";
infowindow = new google.maps.InfoWindow({
content: html
});

google.maps.event.addListener(map, "click", function(event) {
marker = new google.maps.Marker({
position: event.latLng,
map: map
});
google.maps.event.addListener(marker, "click", function() {
infowindow.open(map, marker);
});
});
}

以下是places details的商品回复列表。

Google地图API中的搜索框 - 与信息框数据库链接集成

1 个答案: