Google Maps JSP tag Library

Das sieht ja richtig schick aus, da kann man ganz viele schöne Dinge mit anstellen glaub ich.

Gruß

Lars
 
Hallo,
ich versuche gerade testweise, ein Karte via der googlemaps taglib von lamatek zu erzeugen.
Dies will mir jedoch nicht so ganz gelingen.
Habe folgendes gemacht.

Habe mit eine Key bei Google erzeugt. Dieser funktioniert auch, dass hab ich mit JavaScript getestet, also die Erzeugung einer Karte mit JS funktioniert.

Dann habe ich die googlemaps.jar in /WEB-INF/lib und die googlemaps.tld in /WEB-INF kopiert.
Die Tags stehen mir jetzt auch im Editor (Eclipse) zur Verfügung.
Als nächstes habe ich eine JSP Erzeugt und dort den Code der Examples der lamatek Seite eingefügt. Normaler weiß sollte dann später zu Laufzeit JavaScript durch die Tags in die Seite eigebundne werden doch das geschieht nicht. Hier mal meine JSP
Code:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="/WEB-INF/googlemaps.tld" prefix="googlemaps"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Test Googlemaps</title>
</head>

<body>

<googlemaps:map id="map" width="250" height="300" version="2" type="STREET" zoom="12">
	<googlemaps:key domain="localhost" key="MEIN_KEY"/>
	<googlemaps:point id="point1" address="74 Connors Lane" city="Elkton" state="MD" zipcode="21921" country="US"/>
</googlemaps:map>

</body>
</html>
weiß jemand was ich falsche gemacht habe, oder was ich vergessen haben könnte.

Hier noch meine web.xml

Code:
<?xml version="1.0" encoding="UTF-8"?>
<web-app id="WebApp_ID" version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
	<display-name>
	TestGoogleMaps</display-name>
	
	<welcome-file-list>
		<welcome-file>index.html</welcome-file>
		<welcome-file>index.htm</welcome-file>
		<welcome-file>index.jsp</welcome-file>
		<welcome-file>default.html</welcome-file>
		<welcome-file>default.htm</welcome-file>
		<welcome-file>default.jsp</welcome-file>
	</welcome-file-list>
</web-app>



Beste Grüße

Seppi

Hat sich erstmal erledigt.
Ich hatte wohl übersehen, dass ich einige Tags noch einfügung muss die explizit für die Generierung von JavaScript verantwortlich sind.

Trotzdem Danke

Gruß

Seppi
 
Da ich grade an derselben stelle an stehe meine frage, welche tags hast du noch eingebunden damit es funktioniert hat?

bzw bekomme ich folgende ausnahme wenn ich die seite öffnen möchte:

avax.servlet.ServletException: /jsp/dummy.jsp(12,0) Unable to load tag handler class "com.lamatek.tags.google.GoogleMapTag" for tag "googlemaps:map"
javax.faces.webapp.FacesServlet.service(FacesServlet.java:154)
org.apache.myfaces.webapp.filter.ExtensionsFilter.doFilter(ExtensionsFilter.java:147)

root cause

javax.faces.FacesException: /jsp/dummy.jsp(12,0) Unable to load tag handler class "com.lamatek.tags.google.GoogleMapTag" for tag "googlemaps:map"
org.apache.myfaces.context.servlet.ServletExternalContextImpl.dispatch(ServletExternalContextImpl.java:431)
org.apache.myfaces.application.jsp.JspViewHandlerImpl.renderView(JspViewHandlerImpl.java:211)
org.apache.myfaces.lifecycle.RenderResponseExecutor.execute(RenderResponseExecutor.java:41)
org.apache.myfaces.lifecycle.LifecycleImpl.render(LifecycleImpl.java:132)
javax.faces.webapp.FacesServlet.service(FacesServlet.java:140)
org.apache.myfaces.webapp.filter.ExtensionsFilter.doFilter(ExtensionsFilter.java:147)

Es handelt sich hierbei um eine myFaces Applikation.

**EDIT**
Ok das mit der exception hat sich soeben erledigt, nun bekomme ich eine leere jsp seite angezeigt! Also warum ging bei dir bei der oben genannten jsp das ganze nicht? was muss ich ergänzen, fehlt eventuell eine konfiguration?

Bin für jede Hilfe dankbar.

mfg
 
Zuletzt bearbeitet:
Falls es jemanden interessiert, die Lösung:

Code:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%@ taglib uri="/WEB-INF/googlemaps.tld" prefix="googlemaps"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Test Googlemaps</title>

<googlemaps:map id="map" width="250" height="300" version="2" type="STREET" zoom="12">
	<googlemaps:key domain="localhost" key="ABQIAAAAU5IDceLqYFSp4k84FYLxyRTwM0brOpm-All5BF6PoaKBxRWWERSDiAIGyx-hbmMfA3v7tHF4Tvwfaw"/>
	<googlemaps:point id="point1" address="74 Connors Lane" city="Elkton" state="MD" zipcode="21921" country="US"/>
	<googlemaps:marker id="marker1" point="point1"/>
</googlemaps:map>
<googlemaps:scripttag id="map" scope="page" />
<googlemaps:javascript id="map"></googlemaps:javascript> 
</head>

<body onunload="GUnload()"> 
     <googlemaps:div id="map" scope="page"></googlemaps:div> 

    <googlemaps:initialize id="map" scope="page"/>
</body>
</html>
 
Hallo,

würde auch gerne die google tag libary benutzen.

Habe das JAR File auch wie angegeben in den WEB-INF/lib ordner kopiert.

konnte die Tags auch in einer JSP Seite im JDeveloper einbinden. Allerdings bekomme ich beim Ausführen folgende Fehler:

Code:
Error(12): Instanziieren von Tag nicht möglich: googlemaps:map (Klasse: com.lamatek.tags.google.GoogleMapTag)  Vergewissern Sie sich, dass die Tag-Klasse verfügbar ist und die Tag Library, die die Klasse enthält, nicht von dieser Anwendung ausgeschlossen ist.

Error(12): Klasse für Bean: null nicht gefunden, definiert durch Tag mit Klasse: com.lamatek.tags.google.GoogleMapTag

Error(13): Instanziieren von Tag nicht möglich: googlemaps:key (Klasse: com.lamatek.tags.google.GoogleMapKeyTag)  Vergewissern Sie sich, dass die Tag-Klasse verfügbar ist und die Tag Library, die die Klasse enthält, nicht von dieser Anwendung ausgeschlossen ist.

Error(13): Klasse für Bean: null nicht gefunden, definiert durch Tag mit Klasse: com.lamatek.tags.google.GoogleMapKeyTag

Währe schön, wenn mir jemand eine Lösung für mein Proiblem nennen könnte.

Liebe Grüße
André
 
Hallo,

mein 1. Problem ist gelöst, hatte das jar file nicht richtig eingebunden.

hab nun aber ein neues Problem. Ich bekomme es nicht hin, dass eine deutsche Adresse angezeigt wird, lande immer irgendwo im Wasser.

Möchte folgende Adresse anzeigen:
"Rosengarten, Zweibrücken germany"

habe schon alle erdenglichen Möglichkeiten probiert.

<googlemaps:point id="point1" address="Rosengarten" city="Zweibrücken" state="RLP" zipcode="66482" country="DE"/>
 
Richfaces wäre eine Alternative (ohne jetzt genauerers über deine Applikation zu kennen)

mfg
 
Hallo,

habs mit richfaces probiert, komme damit aber nicht so recht klar.

Gibts da ein verständliches Beispiel, oder Tutoriel?
 
mehr oder weniger Tutorial:http://livedemo.exadel.com/richface...ionid=0CAEFE2DAE009941037E594222BDF09B?c=gmap

hier code snippets von einem dummy projekt (in myFaces):

web.xml muss man filter definieren:
Code:
	<context-param> 
	  <param-name>org.ajax4jsf.SKIN</param-name> 
	  <param-value>blueSky</param-value> 
	</context-param> 
	<filter> 
	  <display-name>Ajax4jsf Filter</display-name> 
	  <filter-name>ajax4jsf</filter-name> 
	  <filter-class>org.ajax4jsf.Filter</filter-class> 
	</filter> 
	<filter-mapping> 
	  <filter-name>ajax4jsf</filter-name> 
	   <servlet-name>Faces Servlet</servlet-name>
	   <dispatcher>REQUEST</dispatcher>
	   <dispatcher>FORWARD</dispatcher>
	   <dispatcher>INCLUDE</dispatcher>
	</filter-mapping>

jsp:
Code:
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%@ taglib uri="http://richfaces.ajax4jsf.org/rich" prefix="rich"%>
<%@ taglib uri="https://ajax4jsf.dev.java.net/ajax" prefix="a4j"%> 

<script type="text/javascript">
   //<![CDATA[
  	function createPoints(data) {
		for (var i = 0; data.length; i++) {
			var point = new GLatLng(data[i].lat, data[i].lng);
			map.addOverlay(createMarkerWithIdentifier(point, data[i].desc));
		}		
   	} 
   	
   	function createMarkerWithIdentifier(point, desc) {
	  var marker = new GMarker(point);
	  GEvent.addListener(marker, "click", function() {
	    marker.openInfoWindowHtml(desc);
	  });
	  return marker;
	}  	
    //]]>
</script>

<html>
    <head>
        <title>Hello World</title>
    </head>
    <body>
        <f:view>
            <h:panelGrid columns="2">
				<rich:gmap binding="#{gmBean.map}"/>	
			</h:panelGrid>        
		<h:form>   
			<a4j:jsFunction name="initializePoints" data="#{gmBean.points}"
				oncomplete="createPoints(data)">
			</a4j:jsFunction>
       	</h:form> 
        </f:view>
        
    </body>
</html>

faces config:
Code:
<managed-bean>
	  <managed-bean-name>gmBean</managed-bean-name>
	  <managed-bean-class>org.richfaces.demo.gmap.Bean</managed-bean-class>
	  <managed-bean-scope>session</managed-bean-scope>
 	</managed-bean>

bean:
Code:
package org.richfaces.demo.gmap;

import java.util.ArrayList;
import java.util.HashMap;

import javax.faces.context.ExternalContext;
import javax.faces.context.FacesContext;
import javax.faces.event.ActionEvent;

import org.richfaces.component.html.HtmlGmap;


public class Bean {
	
	//------------------------------------------------------------------------------------------------------------------
	// FIELDS
	//------------------------------------------------------------------------------------------------------------------
	
	/** google map */
	private HtmlGmap map;

	/** whole authorization for google map */
	private String gmapKey;
	
	/** google key for this application */
	private static final String GOOGLE_API_KEY =  "google api key einfügen"
			
	/** application url */
	private static final String APPL_URL = "url der applikation - localhost:8080 e.g.";
	
	/** host string */
	private static final String HOST = "host";
	
	/** error message if key is not generated for <code>Bean.APPL_URL</code> */
	private static final String KEY_ERROR_MSG =
		"get the key for your domain at http://www.google.com/apis/maps/signup.html";
	
	/** style of the google map */
	private static final String MAP_STYLE = "width:400px;height:400px";
	
	/** java script method which load points for google map - ajax4jsf script */
	private static final String LOAD_POINTS_INITIALIZE = "initializePoints()";
	
	/** google map initial zoom */
	private static final String MAP_ZOOM_INITIAL = "5";
	
	/** google map initial lattidude value */
	private static final String MAP_LATTIDUDE_INITIAL = "37.4419";
	
	/** google map initial longtidude value */
	private static final String MAP_LONGTIDUDE_INITIAL = "-122.1419";
	
	/** google map initial type of show value */
	private static final String MAP_TYPE_INITIAL = "G_NORMAL_MAP";
	
	/** google map variable for java script */
	private static final String MAP_GMAP_VAR = "map";
	
	/** contains google map points data */
	private ArrayList<Place> points;
	
	private String longtitude;
	
	private String lattidude;
	
	private Boolean activate = false;
	
	//------------------------------------------------------------------------------------------------------------------
	// CONSTRUCTOR
	//------------------------------------------------------------------------------------------------------------------

	/**
	 * constructor
	 */
	public Bean() {
		this.points = this.loadDataForMap();
	}
	
	//------------------------------------------------------------------------------------------------------------------
	// HELPER METHODS
	//------------------------------------------------------------------------------------------------------------------
		
	/**
	 * reset user input from view
	 */
	private void resetInput() {
		this.longtitude = "";
		this.lattidude = "";
	}
		
	/**
	 * load points for google map
	 * @return tmp loaded point data for map
	 */
	private ArrayList<Place> loadDataForMap() {
		ArrayList<Place> tmp = new ArrayList<Place>();
		tmp.add(new Place ("goldengate", "/org/richfaces/demo/gmap/images/gold.gif", "37.81765", "-122.477603" , 14,
				"Golden Gate  Bridge, San Francisco"));
		tmp.add(new Place ("eiffeltower", "/org/richfaces/demo/gmap/images//tower.gif", "48.858489", "2.295295" , 17,
				"Eiffel Tower, Paris"));
		tmp.add(new Place ("pyramids", "/org/richfaces/demo/gmap/images/pyramids.gif", "29.977785", "31.132915" , 15,
				"Pyramids of Egypt, Giza"));
		tmp.add(new Place ("exadel", "/org/richfaces/demo/gmap/images/exadel.gif", "37.971796", "-122.042334" , 18,
				"Headquarter of Exadel, Inc , Concord"));	
		return tmp;
	}
	
	/**
	 * create the whole google map key
	 * @return key generated key
	 */
	private String createKey() {
		HashMap<String, String> hosts = new HashMap<String, String>();
		hosts.put(Bean.APPL_URL, Bean.GOOGLE_API_KEY);
		ExternalContext ec = FacesContext.getCurrentInstance().getExternalContext();
		String host = (String)ec.getRequestHeaderMap().get(Bean.HOST);
		String key = hosts.get(host);
		if (key != null) 
			return key;
		else
			return Bean.KEY_ERROR_MSG;	
	}
	
	/**
	 * dummy button - just test
	 *
	 */
	public void doSomething() {
		System.out.println("laft");
		this.map.getGmapVar();
		this.map.getAttributes();
	}
	
	//------------------------------------------------------------------------------------------------------------------
	// GETTER/SETTER
	//------------------------------------------------------------------------------------------------------------------

	/**
	 * getter method
	 * @return gmapKey
	 */
	public String getGmapKey() {
		if (gmapKey == null) {
			gmapKey = createKey();
		}
		return gmapKey;
	}

	/**
	 * setter method
	 * @param gmapKey
	 */
	public void setGmapKey(final String gmapKey) {
		this.gmapKey = gmapKey;
	}

	/**
	 * getter method
	 * @return map
	 */
	public HtmlGmap getMap() {
		return this.map;
	}

	/**
	 * setter method
	 * also initialized google map 
	 * @param map
	 */
	public void setMap(final HtmlGmap map) {
		if (this.map == null) {
			this.map = map;
			this.map.setGmapVar(Bean.MAP_GMAP_VAR);
			this.map.setOninit(Bean.LOAD_POINTS_INITIALIZE);
			this.map.setZoom(Bean.MAP_ZOOM_INITIAL);
			this.map.setStyle(Bean.MAP_STYLE);
			this.map.setGmapKey(this.getGmapKey());
			this.map.setLat(Bean.MAP_LATTIDUDE_INITIAL);
			this.map.setLng(Bean.MAP_LONGTIDUDE_INITIAL);
			this.map.setMapType(Bean.MAP_TYPE_INITIAL);
		} else {
			this.map = map;
		}
	}

	/**
	 * getter method
	 * @return points
	 */
	public ArrayList<Place> getPoints() {
		return this.points;
	}
	
	/**
	 * setter method
	 * @param points
	 */
	public void setPoints(final ArrayList<Place> points) {
		this.points = points;
	}

	public String getLongtitude() {
		return longtitude;
	}

	public void setLongtitude(String longtitude) {
		this.longtitude = longtitude;
	}

	public String getLattidude() {
		return lattidude;
	}

	public void setLattidude(String lattidude) {
		this.lattidude = lattidude;
	}

	public Boolean getActivate() {
		return activate;
	}

	public void setActivate(Boolean activate) {
		this.activate = activate;
	}
}

place:
Code:
package org.richfaces.demo.gmap;

public class Place {
	private String pic;
	private String id;
	private String lat;
	private String lng;
	private int zoom;
	private String desc;
	

	public String getDesc() {
		return desc;
	}
	public void setDesc(String desc) {
		this.desc = desc;
	}
	public Place(String id, String pic, String lat, String lng, int zoom, String desc) {
		super();
		this.id = id;
		this.pic = pic;
		this.lat = lat;
		this.lng = lng;
		this.zoom = zoom;
		this.desc = desc;
	}
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getLat() {
		return lat;
	}
	public void setLat(String lat) {
		this.lat = lat;
	}
	public String getLng() {
		return lng;
	}
	public void setLng(String lng) {
		this.lng = lng;
	}
	public int getZoom() {
		return zoom;
	}
	public void setZoom(int zoom) {
		this.zoom = zoom;
	}
	public String getPic() {
		return pic;
	}
	public void setPic(String pic) {
		this.pic = pic;
	}
}

hoffe das hilft weiter, wenn nicht meld dich wieder.

mfg
 
Zurück