Abrir las ventanas de los marcadores

Por Horacio González. Domingo, 8-02-2009
Otros artículos de la misma sección Buscar otros artículos Citar este artículo

Referencia bibliográfica según la ISO 690-2:

Horacio González. Abrir las ventanas de los marcadores [online]. Vigo, España, Escoitar.org, febrero de 2009 [versión de febrero de 2009] [citado el ].

Disponible en Internet:

http://www.escoitar.org/Abrir-las-ventanas-de-los
Rubricas de este sector
   
Espera un momento ¡Buscando artículos!
Espera un momento ¡Buscando artículos!

La función abrirVentana();

Toda la información de los marcadores está almacenada en tres arrays que contienen la URL de los sonidos, el HTML de cada ventana y el objeto GMarker de cada uno de los marcadores del mapa. Esta información es accesible a través de JavaScript, por lo que las ventanas de los marcadores pueden abrirse desde cualquier parte de la página web. Para hacer esto, se diseño la función abrirVentana(idmarker, idmap) que permite llamar al método GMarker.openInfoWindowHtml() desde cualquier enlace.

function abrirVentana(idmarker, idmap) {
        var map = eval('map'+ idmap);
        map.closeInfoWindow();
        GEvent.addListener(marcadores["id_"+idmarker], "infowindowopen", function() {
                if(URLsons["id_"+idmarker]){
                var fo = new FlashObject( URLbaseGis+"/img_pack/musicplayer.swf?autoplay=true&song_url="+URLsons["id_"+idmarker], "player_x", "17", "17", "6", "#FFFFFF");
                        fo.write("player");
                }
        });
        marcadores["id_"+idmarker].openInfoWindowHtml(contidosHTML["id_"+idmarker]);
}

Para utilizar la función abrirVentana(idmarker, idmap), hay que introducir dos parámetros; el identificador del marcador y el identificador del mapa. El identificador del marcador será el mismo que el identificador del artículo al que haga referencia, es decir id_article. Y el identificador del mapa, será una cadena de texto idéntica a la utilizada en el parámetro {id_carte_gis=''} cuando se llamó al modelo carte_gis.

Por ejemplo, yo suelo utilizar el parámetro id_carte_gis de esta forma; {id_carte_gis='_sommaire'}, {id_carte_gis='_article'}, {id_carte_gis='_mot'}, para que los mapas se llamen ’map_sommaire’, ’map_article’ y ’map_mot’. Después utilizo la función JavaScript de esta manera: abrirVentana(id_article, '_sommaire'), abrirVentana(id_article, '_article'), abrirVentana(id_article, '_mot').


$("a.window").click();

Hay dos formas de llamar a una función JavaScript desde un enlace; utilizando el atributo href o utilizando jQuery. De estas dos opciones, la primera es menos recomendable ya que a veces produce errores cuando el usuario intenta abrir el enlace en una ventana nueva o guardar la dirección del enlace como favorito.

<a href="javascript:abrirVentana(idmarker, idmap);"></a>
La mejor solución para este problema consiste en eliminar el href. De esta forma, se evita que el usuario pueda abrir el enlace o guardar la dirección, ya que non hay ninguna URL a la que dirigirse ni que guardar. Sín href, el único uso que tendrá el enlace será el de ejecutar el código que le asignemos mediante jQuery.

Con el fin de seleccionar todos los enlaces que queramos utilizar para abrir ventanas y poder averiguar el identificador del marcador al que hacen referencia con facilidad, vamos asignarles la clase ’window’ y poner el identificador del artículo, id_article, como valor de su atributo nombre. Así, será muy fácil recoger el valor del atibuto nombre e indicarle a JavaScript lo que debe hacer cuando el usuario pulse en el enlace, utilizando la función $().click() de jQuery.

Este es un ejemplo de un bucle para hacer un listado de enlaces que permitan abrir ventanas en el mapa.

<BOUCLE_ultimasPaisaxes(ARTICLES){par date}{inverse}{0,10}>
        <a class="window" name="#ID_ARTICLE">#TITRE</a>
</BOUCLE_ultimasPaisaxes>
Y este es un ejemplo de la función jQuery que selecciona dichos enlaces, recoge el identificador de los marcadores de la propiedad nombre y les asigna la función abrirVentana().
$("a.window").click(function () {
        var id_marker = $(this).attr("name");
        abrirVentana(id_marker, 'id_map');
});

3 Mensajes del foro