zk Google Maps

Trabajar con google maps en zk es muy fácil, y esto es gracias a que no hay que meterse con javascript, como se hace trabajando directamente con el api de mapas. En esta ocasión les muestro un ejemplo sencillo de como incluir un mapa y mostrar en un Messagebox las coordenadas donde se dió clic en cualquier parte del mapa. A continuación el ejemplo:

index.zul

<zk>
<window
apply="org.zkoss.bind.BindComposer"
viewModel="@id('vm') @init('com.zk.examples.vm.GoogleMapsVM')"
title="${labels.app.titleWindow}"
position="center"
mode="overlapped"
border="normal"
width="70%"
height="80%">

<gmaps id="mymap" width="100%" height="100%" onMapClick="@command('getCoordenadas')" />
</window>
</zk>

1. Como se observa declarar el mapa es muy fácil solo se agrega la etiqueta marcada con gmaps, el ancho, alto y el evento onMapClick el cual usa un método llamado getCoordenadas que muestra el mensaje con las coordenadas.

package com.zk.examples.vm;

import org.zkoss.bind.annotation.Command;
import org.zkoss.bind.annotation.ContextParam;
import org.zkoss.bind.annotation.ContextType;
import org.zkoss.gmaps.event.MapMouseEvent;
import org.zkoss.zul.Messagebox;

public class GoogleMapsVM {

@Command
public void getCoordenadas(@ContextParam(ContextType.TRIGGER_EVENT) MapMouseEvent event){
Messagebox.show("Has hecho clic en las coordenadas: Lat: "+event.getLat()+" Lng: "+event.getLng());

}
}

1. En la clase GoogleMapsVM solo se recibe el evento MapMouseEvent, el cual fue lanzado por el evento onMapClick en el mapa declarado en el archivo index.zul.
2. Por último en event.getLat() y event.getLng(), recuperamos la latitud y longitud.

Para mayor información del uso de google maps consulte la ayuda, (http://books.zkoss.org/wiki/ZK_Component_Reference/Diagrams_and_Reports/Gmaps).


Ejemplo completo:

googlemaps.zip

Importante: Este ejemplo esta probado en Eclipse con tomcat 7 por lo tanto puedes importar el proyecto en tu eclipse y adaptarlo al servidor de tu preferencia.