Hi, yes this will be work!
Someone also know how can I eliminate4 following problem (load values for more Markers from a bean into Javascript):
My idea:
<%@ 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 loadOnePoint(data) {
var point = new GLatLng(data.lat, data.lng);
map.setCenter(point,data.zoom);
map.addOverlay(new GMarker(point));
map.openInfoWindow(map.getCenter(),
document.createTextNode("Fortschritt ;D"));
}
function loadMorePoints(data) {
//geht nicht - JS kennt Collection nicht! :(
for (var i = 0; i < 3; i++) {
map.setCenter(point,data.getAttribute("zoom"));
// var point = new GLatLng(data.lat, data.lng);
// map.addOverlay(new GMarker(point));
map.openInfoWindow(map.getCenter(),
document.createTextNode("Fortschritt ;D"));
}
}
//]]>
</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="loadPoints" data="#{gmBean.loadPoints}"
oncomplete="loadMorePoints(data)">
</a4j:jsFunction>
<h:commandButton tabindex="0" id="blubButton"
value="BUTTON" action="#{gmBean.doSomething}"/>
</h:form>
</f:view>
</body>
</html>
Bean:
package org.richfaces.demo.gmap;
import java.util.ArrayList;
import java.util.HashMap;
import javax.faces.context.ExternalContext;
import javax.faces.context.FacesContext;
import org.richfaces.component.html.HtmlGmap;
public class Bean {
//------------------------------------------------------------------------------------------------------------------
// FIELDS
//------------------------------------------------------------------------------------------------------------------
private Integer zoom = new Integer(17);
/** 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 =
"ABQIAAAAU5IDceLqYFSp4k84FYLxyRTwM0brOpm-All5BF6PoaKBxRWWERSDiAIGyx-hbmMfA3v7tHF4Tvwfaw";
/** application url */
private static final String APPL_URL = "localhost:8080";
/** 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 KML file */
private static final String LOAD_POINTS_KML = "loadPoints()";
/** google map initial zoom */
private static final String MAP_ZOOM_INITIAL = "10";
/** 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";
//------------------------------------------------------------------------------------------------------------------
// HELPER METHODS
//------------------------------------------------------------------------------------------------------------------
public ArrayList<Place> getLoadPoints() {
ArrayList<Place> point = new ArrayList<Place>();
point.add(new Place ("eiffeltower", "/src/main/webapp/tower.gif", "48.858489", "2.295295" , 17,
"Eiffel Tower, Paris"));
point.add(new Place ("goldengate", "/src/main/webapp/resourcegold.gif", "37.81765", "-122.477603" , 14,
"Golden Gate Bridge, San Francisco"));
//FIXME hier kml befüllen? und so map mit pkt befüllen?
return point;
}
/**
* 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 zoom
*/
public Integer getZoom() {
return this.zoom;
}
/**
* setter method
* @param zoom
*/
public void setZoom(final Integer zoom) {
this.zoom = zoom;
}
/**
* 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
*/
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_KML);
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;
}
}
}
The problem is that the bean delivery a Java Array - can I convert it into Javascript?