Comunitat DSTSC
Publicat a Comunitat DSTSC (https://comunitatdstsc.diba.cat)

Inici > FAM - Mapes estàtics de google

FAM - Mapes estàtics de google

Taula de continguts
  • 1. Introducció
  • 2. Integració amb aplicacions FAM
    • 2.1. Codi Html generat
    • 2.2. Definició al BB
    • 2.3. Integració a Areas del FAM

1. Introducció

Google ofereix una api per poder recuperar mapes estàtics (ho recupera com a imatge i es pot posar dintre d'un enllaç que apunti al mapa de google maps).

 

Aquesta és la web amb les especificacions.   https://developers.google.com/maps/documentation/staticmaps/ [1]    

2. Integració amb aplicacions FAM

2.1. Codi Html generat

Per integrar aquest servei a una aplicació fam s'ha de tenir un enllaç del següent tipus:

 

<a href="http://maps.google.com/maps?q=Pl Comercial, 12, Barcelona" target="_blank">
    <img width="170" height="170" src="http://maps.google.com/maps/api/staticmap?center=Pl+Comercial%2C+12%2C+Barcelona&markers=Pl+Comercial%2C+12%2C+Barcelona&zoom=14&size=170x170&maptype=roadmap&sensor=false" />
</a>

 

La clau és que l'enllaç ha de tenir una referència a google maps i la font de la imatge és la pròpia crida a la api de google.

A banda de paràmeters com la mida, és important el paràmete de la ubicació que és vol mostrar tant al enllaç ("?q=Pl Comercial, 12, Barcelona") com a la font de la imatge ("?center=Pl+Comercial%2C+12%2C+Barcelona")

 

2.2. Definició al BB

Per poder definir aquesta crida parametritzable i que s'escapin correctament els valors, s'ha definit la crida amb components de icefaces

<ice:outputLink value="#{xxxBB.staticMap.linkUrl}" target="_blank" rendered="#{not empty xxxBB.staticMap.linkUrl}">
    <img width="600" height="300" src="#{xxxBB.staticMap.imageUrl}" />
</ice:outputLink>

 

Veient aquest codi s'enten que necessitem tenir un ben amb un objecte de tipus staticMap que ens doni linkUrl i imageUrl. Per tals efectes s'ha construit la classe GoogleStaticMapDto que s'inicialitza enviant una adreça

public class GoogleStaticMapDTO {

    private static final String SCHEME = "http";
    private static final String HOST = "maps.google.com";
    private static final String PATH_IMAGE = "/maps/api/staticmap";
    private static final String PATH_LINK = "/maps";

    private String imageUrl;
    private String linkUrl;

    public String getImageUrl() {
        return imageUrl;
    }

    public String getLinkUrl() {
        return linkUrl;
    }

    public void init(String center) {
        try {
            URI uriImage = new URI(SCHEME, HOST, PATH_IMAGE,
                    "center=" + center + "&zoom=14&size=600x300&maptype=roadmap&sensor=true",
                    null);
            imageUrl = uriImage.toASCIIString();

            URI uriLink = new URI(SCHEME, HOST, PATH_LINK,
                    "q=" + center,
                    null);

            linkUrl = uriLink.toASCIIString();

        } catch (URISyntaxException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }
}

 

2.3. Integració a Areas del FAM

A mode exemple, s'ha integrat aquesta crida a la pantalla de Àreas del FAM. S'ha escollit aquesta pantalla per que no tenia molt de negoci.

El funcionament és que en carregar informació de la entitat al formulari (entityToForm) s'inicialitza aquest objecte.

A la jsp, en entrar al detall d'un àrea es mostra la imatge del mapa corresponent a la ubicació amb un enllaç a google maps

Categories: 
Framework v3
Categories: 
Plataforma JEE
Etiquetes: 
FAM
Etiquetes: 
staticmaps
Etiquetes: 
google
Etiquetes: 
maps
Direcció de Serveis de Tecnologies i Sistemes Corporatius. Recinte Mundet - Pavelló Migjorn. 08035 Barcelona

URL d'origen: https://comunitatdstsc.diba.cat/wiki/fam-mapes-estatics-de-google

Enllaços:
[1] https://developers.google.com/maps/documentation/staticmaps/