hola amigos oajla puedan orientarme nose como colocar un info windows en mi java escript les explico este codigo crea un mapa marcadores y botones hago clik en un boton y el mapa de ubica en el centro donde esta el marcador respectivo ,quisiera saber como poder gregarle un infowindows muchas gracias de antemano a la libreria es esta http://gmap3.net/
<script type="text/javascript">
$(function(){
$('#test1').gmap3({
map:{
options:{
center:[-12.0777778,-76.9111111],zoom: 13,
},
callback: function(map){
if (map.getBounds()){
generateMarkers($(this), map);
} else {
$(this).gmap3({
map:{
onces:{
bounds_changed: function(map){
generateMarkers($(this), map);
}
}
}
});
}
},
events:{
mouseover: function(marker, event, data){
var map = $(this).gmap3('post'),
infowindow = $(this).gmap3({action:'get', name:'infowindow'});
if (infowindow){
infowindow.open(map, marker);
infowindow.setContent('hola');
alert(map);
} else {
$(this).gmap3({action:'addinfowindow', anchor:marker, options:{content: 'hola'}});
}
},
mouseout: function(){
var infowindow = $(this).gmap3({action:'get', name:'infowindow'});
if (infowindow){
infowindow.close();
}
}
}
}
});
});
function generateMarkers($this, map, bounds){
var i,
bounds = map.getBounds(),
southWest = bounds.getSouthWest(),
northEast = bounds.getNorthEast(),
lngSpan = Math.abs(northEast.lng() - southWest.lng()),
latSpan = Math.abs(northEast.lat() - southWest.lat());
newMarker($this, 0,-12.0848, -76.9250);
newMarker($this, 1,-12.0489, -77.0010);
newMarker($this, 2,-12.0840, -76.9252);
newMarker($this, 3,-12.0629, -76.9606);
}
function newMarker($this, i, lat, lng, data){
$this.gmap3({
marker:{
options:{
draggable: true,
animation: google.maps.Animation.DROP,
},
latLng: [lat, lng],
callback: function(marker){
var miArray = new Array(4)
miArray[1-1] = "luis"
miArray[2-1] = "ingnacio"
miArray[3-1] = "jose"
miArray[4-1] = "miguel"
var $button = $('<span id="button-'+i+'">['+miArray[i]+'] </span>');
$button
.click(function(overlay){
$this.gmap3("get").panTo(marker.position);
$(overlay.getDOMElement()).children().css('backgro undColor', '#000000').css('display','none');
})
.css('cursor','pointer');
$('#panTo').append($button);
}
},
overlay:{
latLng: [lat, lng],
options:{
content: '<div style="border:1px solid #FF0000;background-color: #00FF00; width:50px; height: 20px; text-align:center">'+i+'</div>',
offset:{
/*y:-32,
x:12*/
y:-32,
x:0
}
},
events:{
mouseover: function(overlay){
$(overlay.getDOMElement()).children().css('backgro undColor', '#0000FF').css('display','none');
},
mouseout: function(overlay){
$(overlay.getDOMElement()).children().css('backgro undColor', '#00FF00').css('display','block');
}
}
}
});
}
</script>
