„Geomajas” változatai közötti eltérés
(→Hibák) |
(→Áttekintés) |
||
1. sor: | 1. sor: | ||
==Áttekintés== | ==Á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é. | 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é. | ||
+ | |||
+ | A kliensoldal bár használható különálló módon, igazi hatékonyság és funkcióbőség a szerver és a kliens összehangolt működésével érhető el. | ||
==Előkészületek== | ==Előkészületek== |
A lap 2017. április 16., 06:35-kori változata
Tartalomjegyzék
Á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é.
A kliensoldal bár használható különálló módon, igazi hatékonyság és funkcióbőség a szerver és a kliens összehangolt működésével érhető el.
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 quickstart application
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 Client Javascript API a Client GWT-t használja. A Javascriptes projektnél a javadoc-os résznél elakad a maven, így csak az API és a gwt2 projekt fordíthat le egyenként. A gwt2 projekt tartalma egy javascript api-t használó mintaalkalmazás, az API ennek a részeként is lefordul, így elég csak ezt lefordítani.
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);
// 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);
}
</script>
A térkép objektumhoz hozzárendelhetők események: az inicializációhoz, a térkép megszűnéséhez, vagy a térkép betöltéséhez.
//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');
});
A térkép objektumhoz hozzárendelhetők eseménykezelők, ezek közül az előre definiáltak:
'navigation'
-el elérhető a NavigationController,'zoomToRectangle'
-el elérhető a ZoomToRectangleController,'featureSelectionDrag'
-al a FeatureSelectionController érhető el aSelectionMethod.CLICK_AND_DRAG
-el együtt,'featureSelectionSingle'
-el elérhető a FeatureSelectionController aSelectionMethod.SINGLE_SELECTION
-el.
Hozzáadni az alábbi módon tudunk:
map.setMapController(gm.MapControllerFactory.createMapController("default_kontroller_neve"));
Van lehetőség saját MapController
létrehozására is:
// Üres kontroller létrehozása
var customMapController = gm.MapControllerFactory.createMapController();
// Egyedi egérmozgás kezelő:
customMapController.setMouseMoveHandler(function(event) {
var screenLocation = mapController.getLocation(event, "screen");
var worldLocation = mapController.getLocation(event, "world");
var screenLocationAsText = "Screen: " + screenLocation.getX() + ", " + screenLocation.getY();
var worldLocationAsText = "World: " + worldLocation.getX() + ", " + worldLocation.getY();
});
// Egyéb események, amelyek:
//setMouseOverHandler
//setMouseOutHandler
//setDownHandler
//setUpHandler
//setDragHandler
//setDoubleClickHandler
// Kontrollerre köthető események (activation, deactivation):
customMapController.setActivationHandler(function() {
alert('Custom controller activated!')
});
//setDeactivationHandler
// MapController hozzáadása a térképhez:
map.setMapController(customMapController);
A layerekhez különböző funkciók társíthatóak, amelyek a FeatureSearchService
segítségével érhetőek el.
var service = map.getFeatureSearchService();
// A layer egy specifikus műveletének lekérése
service.searchById(layer, [id], function(featureHolder){
var feature = featureHolder.getFeatures()[0];
alert("Feature found: " + feature.getLabel());
});
// összes művelet megkeresése
service.searchInBounds(layer, bounds, function(features) {
alert("Features found: " + featureHolder.getFeatures().size());
});
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.
Javadoc
Valamilyen oknál fogva a java, a régebbi javadocos kódrészleteket nem tudja értelmezni a maven a projekteken belül és fordításnál szintaktikai hibát eredményez. A projektek szükséges részei egyenként is lefordíthatóak.
JettyRunner
A geomajas fejlesztői oldalán leírtak alapján, a GWT kliens és szerver oldal, az eclipse segítségével is fordítható lett volna, azonban a GWT pluginnal felkonfigurált eclipse a projekt betöltését követően a JettyRunner jetty szerverkonfiguráció futtatásánál elszáll.
Forrás, Linkek
A wiki oldal megírásához az alábbi oldalakat használtam:
- http://www.geomajas.org/geomajas - Geomajas official site.
- https://github.com/geomajas - Geomajas Github.
- http://www.geomajas.org/client-javascript/snapshot - Javascript Snapshot és kis konfigurálással működőképessé varázsolható dokumentáció.
- http://files.geomajas.org/maven/ - A régebbi Geomajas dokumentációk.