View on GitHub

gisfaces.github.io

GISFaces: Bringing Enterprise GIS To JavaServer Faces

Welcome to GISFaces

GISFaces™ is an Enterprise GIS mapping component library for JavaServer Faces (JSF). The underlying GIS mapping engine used is the ESRI® ArcGIS API For JavaScript. Any ArcGIS layer or raw data, local or online, can be used in the maps you build. Best of all, no prior GIS programmer or analyst experience is necessary to start integrating GIS maps into your enterprise applications.

Features

Examples

All the latest and legacy example maps are available live.

Usage

Aeronautical Map Example

XHTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pe="http://primefaces.org/ui/extensions"
	xmlns:gis="http://gisfaces.com">

<ui:composition template="/view/template/template.xhtml">

	<ui:define name="title">
		<h:outputText value="GISFaces - Aeronautical Map"></h:outputText>
	</ui:define>

	<ui:define name="content">

		<p:growl id="growl1" showSummary="true" showDetail="true" keepAlive="true"></p:growl>

		<pe:layoutPane position="west" size="300" closable="true" resizable="false">
			<f:facet name="header">
				<h:outputText value="Layers"></h:outputText>
			</f:facet>
			<h:form id="westForm">
				<p:panel header="Aeronautical" styleClass="containerPanel" toggleable="true">
					<h:panelGrid columns="2">
						<p:toggleSwitch value="#{aeronauticalView.airports.visible}">
							<f:ajax render=":mapForm:map1"></f:ajax>
						</p:toggleSwitch>
						<h:outputText styleClass="bold" value="Airports"></h:outputText>
					</h:panelGrid>
					<h:panelGrid columns="2">
						<p:toggleSwitch value="#{aeronauticalView.runways.visible}">
							<f:ajax render=":mapForm:map1"></f:ajax>
						</p:toggleSwitch>
						<h:outputText styleClass="bold" value="Runways"></h:outputText>
					</h:panelGrid>
				</p:panel>
				<p:panel header="Weather" styleClass="containerPanel" toggleable="true">
					<h:panelGrid columns="2">
						<p:toggleSwitch  value="#{aeronauticalView.warnings.visible}">
							<f:ajax render=":mapForm:map1 warningsSlider"></f:ajax>
						</p:toggleSwitch >
						<h:outputText styleClass="bold" value="Weather Warnings"></h:outputText>
					</h:panelGrid>
					<h:panelGrid width="100%" title="Opacity">
						<p:slider id="warningsSlider" for="warningsOpacity" minValue="0.0" maxValue="1.0" step="0.01" disabled="#{not aeronauticalView.warnings.visible}">
							<p:ajax event="slideEnd" process="warningsOpacity" update=":mapForm:map1"></p:ajax>
						</p:slider>
						<h:inputHidden id="warningsOpacity" value="#{aeronauticalView.warnings.opacity}"></h:inputHidden>
					</h:panelGrid>
					<h:panelGrid columns="2">
						<p:toggleSwitch value="#{aeronauticalView.radar.visible}">
							<f:ajax render=":mapForm:map1 radarSlider"></f:ajax>
						</p:toggleSwitch >
						<h:outputText styleClass="bold" value="Doppler Radar"></h:outputText>
					</h:panelGrid>
					<h:panelGrid width="100%" title="Opacity">
						<p:slider id="radarSlider" for="radarOpacity" minValue="0.0" maxValue="1.0" step="0.01" disabled="#{not aeronauticalView.radar.visible}">
							<p:ajax event="slideEnd" process="radarOpacity" update=":mapForm:map1"></p:ajax>
						</p:slider>
						<h:inputHidden id="radarOpacity" value="#{aeronauticalView.radar.opacity}"></h:inputHidden>
					</h:panelGrid>
				</p:panel>
			</h:form>
		</pe:layoutPane>

		<pe:layoutPane position="center">
			<f:facet name="header">
				<h:outputText value="Aeronautical Map"></h:outputText>
			</f:facet>
			<h:form id="centerForm" style="height:100%;">
				<h:panelGroup id="panel1" layout="block" styleClass="gisfaces-map-panel"></h:panelGroup>
			</h:form>
		</pe:layoutPane>

		<h:form id="mapForm">
			<gis:map id="map1" panel=":centerForm:panel1" basemap="#{aeronauticalView.basemap}" latitude="#{aeronauticalView.latitude}" longitude="#{aeronauticalView.longitude}" zoom="#{aeronauticalView.zoom}" model="#{aeronauticalView.model}">
				<f:ajax event="basemap" listener="#{aeronauticalView.doMapBasemapListener}" render="growl1"></f:ajax>
				<f:ajax event="click" listener="#{aeronauticalView.doMapClickListener}" render="growl1"></f:ajax>
				<f:ajax event="extent" listener="#{aeronauticalView.doMapExtentListener}" render="growl1"></f:ajax>
				<f:ajax event="select" listener="#{aeronauticalView.doMapSelectListener}" render="growl1"></f:ajax>
			</gis:map>
		</h:form>

	</ui:define>

</ui:composition>

</html>

Java

package com.gisfaces.examples.transportation;

import java.io.Serializable;

import javax.annotation.PostConstruct;
import javax.enterprise.context.SessionScoped;
import javax.inject.Named;

import com.gisfaces.model.layer.MapImageLayer;

@Named
@SessionScoped
public class AeronauticalView extends WeatherView implements Serializable
{
	private MapImageLayer airports;
	private MapImageLayer runways;

	@PostConstruct
	public void init()
	{
		super.init();

		// Build a map layer.
		airports = new MapImageLayer("airports", "https://maps.bts.dot.gov/services/rest/services/NTAD/Airports/MapServer");

		// Build a map layer.
		runways = new MapImageLayer("runways", "https://maps.bts.dot.gov/services/rest/services/NTAD/Runways/MapServer");

		// Some services may require the included proxy to be enabled.
		this.getModel().getConfiguration().setProxyEnabled(true);

		// Initialize the map view.
		this.getModel().getLayers().add(airports);
		this.getModel().getLayers().add(runways);
	}

	public MapImageLayer getAirports()
	{
		return airports;
	}

	public void setAirports(MapImageLayer airports)
	{
		this.airports = airports;
	}

	public MapImageLayer getRunways()
	{
		return runways;
	}

	public void setRunways(MapImageLayer runways)
	{
		this.runways = runways;
	}
}

GitHub Repositores