【发布时间】：2013-02-27 14:47:02
【问题描述】：
我已关注 this tutorial 创建自定义 Google 地图。我已经包含了一些其他元素，例如将其链接到 Wordpress 并将标记聚类。
除了每个标记的信息窗口中的信息外，一切都很好。我似乎无法更改每个信息中的信息。我认为通过更改以下几行会改变它，但没有任何影响：
var html = "<b>" + name + "</b> <br/>" + address;
我可以在哪里将自己的自定义数据放入窗口中？另外，如果我可以在上面设置窗口样式会更好。
看来是clusterer的问题，主要是这个部分，怎么把html内容放到info window里面？
function load() {
var cluster = [];
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(52.375599, -3.471680),
zoom: 8,
mapTypeId: 'roadmap'
});
var infowindow = new google.maps.InfoWindow();
var min = .999999;
var max = 1.000002;
// Change this depending on the name of your PHP file
downloadUrl("<?php bloginfo('stylesheet_directory'); ?>/phpsqlajax_genxml.php ", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
var type = markers[i].getAttribute("type");
var offsetLat = markers[i].getAttribute("lat") * (Math.random() * (max - min) + min);
var offsetLng = markers[i].getAttribute("lng") * (Math.random() * (max - min) + min);
var point = new google.maps.LatLng(offsetLat, offsetLng);
var html = "<b>" + name + "</b> <br/>" + address;
var icon = customIcons[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
// infowindow.setContent(markers[i].getAttribute("name"));
// infowindow.open(map, marker, html);
infowindow.setContent(html); infowindow.open(map, marker);
}
})(marker, i));
cluster.push(marker);
}
var mc = new MarkerClusterer(map,cluster);
});
}
具体这个，不是把html内容通过clusterer放...至少这实际上是在改变window中的数据，只需要在不破坏clusterer的情况下输出html内容：
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(markers[i].getAttribute("name"));
infowindow.open(map, marker, html);
}
})(marker, i));
cluster.push(marker);
到目前为止，我拥有的最接近的是这个，但它为每个标记显示相同的信息。它正在显示 html 内容：
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
// infowindow.setContent(markers[i].getAttribute("name"));
// infowindow.open(map, marker, html);
infowindow.setContent(html); infowindow.open(map, marker);
}
})(marker, i));
cluster.push(marker);
【问题讨论】：
-
你能给你的代码加上html使用吗？
-
首先我们需要创建 infowindow 对象吗？或者你省略了它。 var infowindow = 新的 google.maps.InfoWindow({content: html})。而在 addListener 中，infowindow.open(map, marker);从 addListener link 中删除 infowindow.setContent
-
请尝试我提供的链接。特别是带有link2的那个
-
将 addListener 中的 infowindow 代码替换为 infowindow.setContent(html); infowindow.open(地图, 标记);
标签： javascript google-maps google-maps-api-3