Abrir infoWindow en Google Maps

[catpaw]

hola, yo tengo problemas tambien

Hace mucho tiempo trabaje con esta API y no recuerdo que haya sido tan engorroso poner el globo de informacion de un marcador...:/


Mi problema es que no he encontrado como abrir mi contenido (como una imagen y una descripcion) en un "globo" de informacion como el sale normalmente al dar clic en algun marcador del mapa.

Para poder abrir algo con mi propio contenido tuve que bajar un archivo aparte (infobox.js) que me da chance de personalizar el div donde se abre la informacion del marcador.

Pero lo que quisiera es hacerlo en el "globo" normal que usa google maps.

De todos modos te dejo mi codigo, que al menos si funciona bien, sale el globo de informacion de primera hora como dices, y al cerrarlo lo puedes abrir al dar clic al marcador, espero te funcione.

Si alguien conoce una forma mas facil y sin tener que agregar archivos aparte, se los agradeceria.

Código Javascript:

<script type="text/javascript">
    var myLatlng = new google.maps.LatLng(#,-#);
    var marker;
    var map;
    var image = '../images_icon/tip.png';
    
    function initialize(){  
        var mapOptions = {
            zoom: 15,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
        
        var marker = new google.maps.Marker({      
            map: map,
            draggable: false,
            animation: google.maps.Animation.DROP,  
            position: myLatlng,
            icon: image,
            title: "Hello World!"  
        });
        
        var boxText = document.createElement("div");
        boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: white; padding: 5px;";
        boxText.innerHTML = "Direccion imagen";
        
        var myOptions = {
            content: boxText,
            disableAutoPan: false,
            maxWidth: 0,
            pixelOffset: new google.maps.Size(-140, 0),
            zIndex: null,
            boxStyle: {
                //background: "url('tipbox.gif') no-repeat",
                opacity: 0.75,
                width: "280px"
            },
            closeBoxMargin: "10px 2px 2px 2px",
            closeBoxURL: "../images_icon/cancel.png",
            infoBoxClearance: new google.maps.Size(1, 1),
            isHidden: false,
            pane: "floatPane",
            enableEventPropagation: false
        };
        var ib = new InfoBox(myOptions);
        ib.open(map, marker);
    
        google.maps.event.addListener(marker, 'click', function(){
            ib.open(map, marker);
        });
    }
    
    google.maps.event.addDomListener(window, 'load', initialize);
</script>