-1
Infowindow沒有顯示在谷歌地圖適當的地方,所有infowindow都顯示在同一點。Infowindow在谷歌地圖不顯示在相關的點
我從數據庫中動態獲取記錄,並在單個地圖上顯示多個標記。
<script language="javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.8/src/markerwithlabel.js"></script>
<script type="text/javascript">
var markers = [
['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2620768"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/768/2620768.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">22-13 Steinway St<br>NY, 11103</span></div>', 40.772327, -73.906257],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2618343"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/343/2618343.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">44-09 Broadway<br>NY, 11103</span></div>', 40.7584945, -73.9185441],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2563251"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/251/2563251.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">48-15 31 Ave<br>NY, 11103</span></div>', 41.440565, -74.392076],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2474854"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/854/2474854.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">30-62 36th St<br>NY, 11103</span></div>', 40.7635902, -73.9188238],['<div style="float:left;"><span style="float:left; margin-right:5px;"><a href="property-detail.php?ml_num=2641580"><img src="cropImage.php?image=http://links.mlslirealtor.com/mlsphotos/full/1/580/2641580.jpg&w=40&h=40" width="40" height="40" border="0" ></a></span><span style="float:left; text-align:center;">25-92 36th St<br>NY, 11103</span></div>', 40.767123, -73.916005] ];
var labels = ["$199k","$3.20k","$65.80k","$1.88m","$1.50m","$1.80m"];
function initializeMaps() {
var myOptions = {
mapTypeId: google.maps.MapTypeId.ROADMAP,
//mapTypeId: google.maps.MapTypeId.TERRAIN
mapTypeControl: true
};
var map = new google.maps.Map(document.getElementById('map_canvas'),myOptions);
var infowindow = new google.maps.InfoWindow();
var marker, i;
var bounds = new google.maps.LatLngBounds();
for (i = 0; i < markers.length; i++) {
var pos = new google.maps.LatLng(markers[i][1], markers[i][2]);
bounds.extend(pos);
var marker = new MarkerWithLabel({
position: pos,
draggable: true,
raiseOnDrag: true,
map: map,
icon: 'assets/images/home_iconddd.png',
labelContent: labels[i],
//labelAnchor: new google.maps.Point(0, 0),
labelClass: "labels" // the CSS class for the label
//labelStyle: {opacity: 0.95}
});
google.maps.event.addListener(marker, 'mouseover', (function(marker, i) {
return function() {
infowindow.setContent(markers[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
map.fitBounds(bounds);
}
</script>
<div id="map_canvas" style="height:850px"></div>
請重新格式化您的代碼,它幾乎是不可讀 – faboolous
@fablife我已經格式化,但仍表現出同樣的問題... [谷歌地圖API的 –
可能重複 - 多個圖標在錯誤的地方](http://stackoverflow.com/questions/22202569/google-map-api-multiplei-i錯誤的現場) – geocodezip