„Geomajas” változatai közötti eltérés

Innen: GIS Wiki
(A projekt szerkezete)
61. sor: 61. sor:
  
 
Miután betöltődik a kontextusthoz szükséges GWT-s modul, létrejön egy MapPresenter, majd hozzá egy default inicializáló. Ezután a szerverkódból inicializáljuk ezt. Ezt követi a Layout beállítása, hozzáadása a megjelenítéshez, valamint egy ApplicationService létrehozása, amely kiszolgálja a ezt a Layert. Ezután hozzáadásra kerül egy egyedi eseménykezelő.
 
Miután betöltődik a kontextusthoz szükséges GWT-s modul, létrejön egy MapPresenter, majd hozzá egy default inicializáló. Ezután a szerverkódból inicializáljuk ezt. Ezt követi a Layout beállítása, hozzáadása a megjelenítéshez, valamint egy ApplicationService létrehozása, amely kiszolgálja a ezt a Layert. Ezután hozzáadásra kerül egy egyedi eseménykezelő.
 +
 +
== Javascript API ==
 +
A Githubról a Javascript project (https://github.com/geomajas/geomajas-project-javascript)letöltése után, lefordíthatjuk a gwt2-es projektet, ami legenerálja a szükséges javascript fájlokat és létrehozza a megfelelő index.html-eket, mind szerver mind kliens oldalon. Az eredmény ideiglenesen a http://people.inf.elte.hu/bagtaai címen elérhető.
 +
 +
A map betöltéséhez ez a modul egy <code>onGeomajasLoad</code> függvényt használ, ami lényegében az inicializációt hajtja végre. Az alábbi kódrészlet mutatja a legenerált index.html-ben szereplő példát.
 +
 +
<source lang="javascript">
 +
<script type="text/javascript">
 +
var map;
 +
var WMS_BASE_URL = "http://apps.geomajas.org/geoserver/demo_world/ows";
 +
var wmsVersion = "1.3.0"; //default value
 +
 +
 +
function onGeomajasLoad() {
 +
var mapConfig = new gm.MapConfiguration();
 +
mapConfig.setCrs("EPSG:4326", "DEGREES");
 +
mapConfig.setMinimumResolution(2.1457672119140625E-5)
 +
mapConfig.setMaxBounds(new gm.Bbox(-180, -90, 360, 180));
 +
 +
// Map létrehozása és inicializálása
 +
 +
map = new gm.Map("js-map-element", mapConfig);
 +
 +
                //Maphez hozzárendelhető események
 +
map.getEventBus().addLayerAddedHandler(function(event) {
 +
  // custom code; event contains the added layer
 +
  alert('layer added: ' + event.getAddedLayer().getTitle());
 +
});
 +
map.getEventBus().addLayerRemovedHandler(function(event) {
 +
  // custom code; event contains the removed layer
 +
  alert('layer removed: ' + event.getRemovedLayer().getTitle());
 +
});
 +
map.getEventBus().addMapInitializationHandler(function(event) {
 +
  // custom code
 +
  alert('map fully initialized');
 +
});
 +
 +
// Kiürítjük a map-et
 +
map.getLayersModel().clear();
 +
 +
var tileConfig = new gm.layer.TileConfiguration(256, 256, new gm.Coordinate(-180, -90),
 +
map.getViewPort());
 +
var layerConfig = new gm.WmsLayerConfiguration();
 +
 +
layerConfig.setBaseUrl(WMS_BASE_URL);
 +
layerConfig.setFormat("image/png");
 +
layerConfig.setVersion(wmsVersion);
 +
layerConfig.setLayers("demo_world:simplified_country_borders");
 +
layerConfig.setMinimumResolution(2.1457672119140625E-5);
 +
layerConfig.setMaximumResolution(Number.MAX_VALUE);
 +
 +
// Létrehozunk egy WMS Layert és hozzáadjuk a maphez:
 +
 +
var wmsLayer = new gm.WmsLayer("Blue Marble", map, layerConfig, tileConfig);
 +
wmsLayer.setMaxBounds(new gm.Bbox(-180, -90, 360, 360));
 +
map.getLayersModel().addLayer(wmsLayer);
 +
}
 +
</source>
 +
  
 
==Hibák==
 
==Hibák==
A Quickstart application, mavenes fordítása és futtatása probléma nélkül megtörtént, azonban a client-gwt2, és a szerveroldali projekt fordítása korántsem volt zökkenőmentes.
+
A Quickstart application, mavenes fordítása és futtatása probléma nélkül megtörtént, azonban a client-gwt2, és a szerveroldali projekt fordítása korántsem volt zökkenőmentes. A javascriptes projekt a javadoc generálásánál elszáll, de egyenként fordítható az api és a gwt2 projekt.
  
 
===Checkstyle===
 
===Checkstyle===

A lap 2017. április 6., 09:31-kori változata

Áttekintés

A Geomajas (http://www.geomajas.org/) egy Java nyelven íródott Open Source Web Mapping Framework. Mind szerver, mind kliensoldali komponenseket kínál. Szerveroldalon Java, Javascript, míg kliensoldalon Java (GWT) és Javascript nyelven tesz megvalósításokat elérhetővé.

Előkészületek

A mintaprogramok fordításához és futtatásához Maven-t használnak (https://maven.apache.org/). Ahhoz, hogy futtatni és fordítani tudjuk a github-os projekteket, a Maven telepítési könyvtárában a settings.xml-ben (HOME/.m2/settings.xml) fel kell venni néhány dependency-t, ez az xml a github-os gwt kliensnél megtalálható. (https://github.com/geomajas/geomajas-project-client-gwt2)

Kezdésként a GWT-s standalone applicationt indítsuk el. (https://github.com/geomajas/geomajas-gwt2-quickstart-application) Fordítsuk le a Mavennel a projektet, majd futtassuk.

mvn install

mvn jetty: run

Ezután látogassunk el a http://localhost:8080/-ra, ahol megtekinthető az eredmény.

A GWT mintaalkalmazás projekt szerkezete

A GWT-s projekt általában egy gyökér könyvtárbeli szerver és kliens oldali csomagból áll. A kliens oldali belépési pontot az Application.java fájl tartalmazza, ami a következő helyen található: ..\geomajas-gwt2-quickstart-application-master\src\main\java\org\geomajas\quickstart\gwt2\client.

Ez megvalósítja a com.google.gwt.core.client.EntryPoint interfészt, így implementálni kell az onModuleLoad metódust. A kód egyszerű: létrejön egy ApplicationLayout, majd hozzáadódik a megjelenítéshez.

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootLayoutPanel;

public class Application implements EntryPoint {

	@Override
	public void onModuleLoad() {
		ApplicationLayout layout = new ApplicationLayout();
		RootLayoutPanel.get().add(layout);
	}
}

Az ApplicationLayout geomajas specifikus layout, a következő módon keletkezik:

public ApplicationLayout() {
		initWidget(UIBINDER.createAndBindUi(this));
		ApplicationResource.INSTANCE.css().ensureInjected();

		mapPresenter = GeomajasImpl.getInstance().createMapPresenter();
		mapPresenter.getEventBus().addMapInitializationHandler(new MyMapInitializationHandler());

		GeomajasServerExtension.getInstance().initializeMap(mapPresenter, "app", "mapMain");

		mapLayoutPanel = new MapLayoutPanel();
		mapLayoutPanel.setPresenter(mapPresenter);
		mapPanel.add(mapLayoutPanel);

		appService = ApplicationService.getInstance();
		appService.setMapPresenter(mapPresenter);
		appService.setMapLayoutPanel(mapLayoutPanel);

		appService.getMapPresenter().getEventBus().addHandler(FeatureMouseOverHandler.TYPE, new MyFeatureMouseOverHandler());

	}

Miután betöltődik a kontextusthoz szükséges GWT-s modul, létrejön egy MapPresenter, majd hozzá egy default inicializáló. Ezután a szerverkódból inicializáljuk ezt. Ezt követi a Layout beállítása, hozzáadása a megjelenítéshez, valamint egy ApplicationService létrehozása, amely kiszolgálja a ezt a Layert. Ezután hozzáadásra kerül egy egyedi eseménykezelő.

Javascript API

A Githubról a Javascript project (https://github.com/geomajas/geomajas-project-javascript)letöltése után, lefordíthatjuk a gwt2-es projektet, ami legenerálja a szükséges javascript fájlokat és létrehozza a megfelelő index.html-eket, mind szerver mind kliens oldalon. Az eredmény ideiglenesen a http://people.inf.elte.hu/bagtaai címen elérhető.

A map betöltéséhez ez a modul egy onGeomajasLoad függvényt használ, ami lényegében az inicializációt hajtja végre. Az alábbi kódrészlet mutatja a legenerált index.html-ben szereplő példát.

<script type="text/javascript">
	var map;
	var WMS_BASE_URL = "http://apps.geomajas.org/geoserver/demo_world/ows";
	var wmsVersion = "1.3.0"; //default value


	function onGeomajasLoad() {
		var mapConfig = new gm.MapConfiguration();
		mapConfig.setCrs("EPSG:4326", "DEGREES");
		mapConfig.setMinimumResolution(2.1457672119140625E-5)
		mapConfig.setMaxBounds(new gm.Bbox(-180, -90, 360, 180));

		// Map létrehozása és inicializálása
			
		map = new gm.Map("js-map-element", mapConfig);

                //Maphez hozzárendelhető események
		map.getEventBus().addLayerAddedHandler(function(event) {
		   // custom code; event contains the added layer
		   alert('layer added: ' + event.getAddedLayer().getTitle());
		});
		map.getEventBus().addLayerRemovedHandler(function(event) {
		   // custom code; event contains the removed layer
		   alert('layer removed: ' + event.getRemovedLayer().getTitle());
		});
		map.getEventBus().addMapInitializationHandler(function(event) {
		   // custom code
		   alert('map fully initialized');
		});

		// Kiürítjük a map-et
		map.getLayersModel().clear();
		
		var tileConfig = new gm.layer.TileConfiguration(256, 256, new gm.Coordinate(-180, -90),
				map.getViewPort());
		var layerConfig = new gm.WmsLayerConfiguration();

		layerConfig.setBaseUrl(WMS_BASE_URL);
		layerConfig.setFormat("image/png");
		layerConfig.setVersion(wmsVersion);
		layerConfig.setLayers("demo_world:simplified_country_borders");
		layerConfig.setMinimumResolution(2.1457672119140625E-5);
		layerConfig.setMaximumResolution(Number.MAX_VALUE);

		// Létrehozunk egy WMS Layert és hozzáadjuk a maphez:

		var wmsLayer = new gm.WmsLayer("Blue Marble", map, layerConfig, tileConfig);
		wmsLayer.setMaxBounds(new gm.Bbox(-180, -90, 360, 360));
		map.getLayersModel().addLayer(wmsLayer);		
	}


Hibák

A Quickstart application, mavenes fordítása és futtatása probléma nélkül megtörtént, azonban a client-gwt2, és a szerveroldali projekt fordítása korántsem volt zökkenőmentes. A javascriptes projekt a javadoc generálásánál elszáll, de egyenként fordítható az api és a gwt2 projekt.

Checkstyle

A checkstyle egy kódformázó plugin, amit a régebbi eclipsekben használtak, azonban az újakban már eleve benne van. Kezdetben a plugin (https://maven.apache.org/plugins/maven-checkstyle-plugin/) verzióját nem találta meg a maven, ezt orvosolta a fejlesztők levelezéséből kiderített client-gwt2 projektben található settings.xml megfelelő helyre történő átmozgatása.

FirefoxBinary

A kliensoldali kód azonban így sem fordult le, a tesztek futtatásakor a selenium (http://www.seleniumhq.org/) plugin nem tudta elérni a FirefoxBinary-t és nem tudta lefuttatni a hozzá tartozó részeket. Ezt orvosolta a mvn install -DskipTests utasítás, ami a teszteket kihagyva képes sikeres fordítást produkálni.