Geodaten und Application Express: Oracle MAPS

Geodaten und Application Express: Oracle MAPS!

Heute schließen wir das Geodaten-Tutorial, welches sich über die letzten drei Ausgaben zog, ab. Auch diese Ausgabe baut auf den bisherigen auf:

Heute erfahren Sie mehr über Oracle Maps. Mit Oracle Maps wird die Navigation in Ihrer Karte wesentlich einfacher, intuitiver und performanter. Oracle Maps ist Bestandteil des MapViewer, den Sie bereits installiert haben.

Um die Performance der Kartendarstellung zu verbessern, werden die Karten in Kacheln unterteilt - diese Kacheln werden nach Erstellung in einem Cache (Map Cache) abgelegt. Dies macht natürlich nur für die Kartenteile Sinn, welche stets angezeigt werden sollen (Base Maps). Zur Base Map werden dann die Features Of Interest (FOI) hinzugefügt - diese werden dynamisch aus der Datenbank gelesen und in die Karte integriert.

Das Besondere an Oracle Maps ist die einfache Navigation in der Karte - Sie müssen nicht mehr, wie in der letzten Ausgabe, Schaltflächen zum Hinein- und Heraus-Zoomen oder zum Verschieben der Karte hinterlegen - dies geht nun viel einfacher direkt mit Drag & Drop.

Aufbau einer Karte mit Oracle Maps

Abbildung 1: Aufbau einer Karte mit Oracle Maps

Oracle Maps basiert auf JavaScript und der AJAX-Technologie. Nur so ist die intuitive Navigation in der Karte - direkt mit der Maus - möglich. Sie binden die Karte also nun mit JavaScript und nicht mehr mit der MapViewer PL/SQL-Client-Bibliothek in Ihre Application Express-Anwendung ein.

Vorbereitungen

Damit der Oracle Maps JavaScript-Code mit dem MapViewer kommunizieren kann, muss der MapViewer nicht nur auf dem gleichen Server wie die Application Express-Anwendung laufen, er muss sogar den gleichen TCP/IP-Port verwenden. Grund sind Browser-Restriktionen für JavaScript - aus Sicherheitgründen darf JavaScript-Code nur mit dem Server kommunizieren, von dem die ganze Seite geladen wurde. Wenn Oracle Maps in eine Application Express-Anwendung integriert wird, gilt also, dass der Oracle Maps JavaScript-Code nur mit dem Application Express-Server kommunizieren darf. Bis zur letzten Ausgabe sah Ihre Konfiguration jedoch anders aus:

  • Application Express: http://[host]:7780/pls/htmldb
  • Application Express: http://[host]:8888/mapviewer

Aus Sicht von JavaScript sind dies zwei unterschiedliche Server. Im ersten Schritt muss demnach sichergestellt werden, dass der MapViewer unter dem gleichen Hostnamen und dem gleichen TCP/IP-Port wie Application Express erreichbar ist - solange dies nicht sichergestellt wird, kann Oracle Maps nicht in Application Express eingebunden werden.

Glücklicherweise ist dies ganz einfach: Mit dem Apache Modul mod_proxy können Sie genau dies erreichen. Zur Durchführung der folgenden Schritte benötigen Sie Zugriff auf den Server, auf welchem Application Express läuft - lassen Sie sich bei Bedarf von Ihrem Administrator helfen. Navigieren Sie auf dem Server in die Apache-Datei httpd.conf (natürlich müssen die hier dargestellten Verzeichnisse auf Ihrem Server nicht exakt genauso aussehen): 

/home/oracle $ cd $COMPANION_CD_HOME
/oracle/u01/app/oracle/product/Companion $ cd Apache/Apache/conf
/oracle/u01/app/oracle/product/Companion/Apache/Apache/conf $ vi httpd.conf

Stellen Sie sicher, dass das Modul mod_proxy geladen wird - die ensprechende LoadModule-Anweisung darf nicht mit einem # auskommentiert sein: 

:
LoadModule dbm_auth_module    libexec/mod_auth_dbm.so
LoadModule digest_module      libexec/mod_digest.so
LoadModule proxy_module       libexec/libproxy.so
LoadModule cern_meta_module   libexec/mod_cern_meta.so
LoadModule expires_module     libexec/mod_expires.so
:

Navigieren Sie nun zur Datei dads.conf, in welcher die Application Express-Konfiguration enthalten ist (manche Application Express-Installationen verwenden auch die Datei marvel.conf): 

/oracle/u01/app/oracle/product/Companion/Apache/Apache/conf $ cd $COMPANION_CD_HOME
/oracle/u01/app/oracle/product/Companion $ cd Apache/modplsql/conf
/oracle/u01/app/oracle/product/Companion/Apache/modplsql/conf $ vi dads.conf

Fügen Sie der Datei dads.conf folgende Zeilen hinzu: 

ProxyRequests On
ProxyPass /mapviewer/ http://[mapviewer-host]:8888/mapviewer/
ProxyPassReverse /mapviewer/ http://[mapviewer-host]:8888/mapviewer/
NoCache *

Starten Sie den Apache-Server anschließend neu. Testen Sie das Proxy-Modul, in dem Sie im Browser die URL von Application Express eingeben, anstelle von /pls/htmldb oder /pls/apex geben Sie jedoch /mapviewer/ ein. Sie sollten dann die MapViewer-Startseite sehen.

Zugriff auf den Oracle MapViewer über Hostnamen und TCP/IP-Port von Application Express

Abbildung 2: Zugriff auf den Oracle MapViewer über Hostnamen und TCP/IP-Port von Application Express

Bereitstellen von Speicherplatz für Oracle Maps

Für das einwandfreie Funktionieren von Oracle Maps ist es wichtig, dass der MapViewer ausreichend Speicherplatz zum Generieren der Karten allokieren kann. Das Maximum von 64MB für den Java Heap Space, welches standardmäßig gilt, reicht in vielen Fällen nicht aus. Starten Sie daher den MapViewer wie folgt, um (in diesem Beispiel) 512MB bereitzustellen. 

$ java -Xmx512m -jar oc4j.jar

Login als MapViewer Administrator

MapViewer Admin-Bereich Als nächstes geht es daran, den Map Cache einzurichten. Navigieren Sie rechts oben in den Bereich Admin - im dann folgenden Login-Fenster melden Sie sich als Administrator des OC4J (Oracle Containers for J2EE) an. Der Username ist normalerweise oc4jadmin; das Passwort haben Sie beim ersten Start des MapViewer festgelegt.

MapViewer Administrationsbereich

Abbildung 3: MapViewer Administrationsbereich

Exkurs: Administrator-Password des MapViewer (OC4J) neu setzen

Wenn Sie das Passwort nicht mehr wissen, navigieren Sie in das Verzeichnis, in welches Sie (in der vorletzten Ausgabe) das MapViewer QuickStartKit ausgepackt haben und setzen Sie das Passwort wie folgt neu: 

.../OC4J $ cd j2ee
.../OC4J/j2ee $ cd home
.../OC4J/j2ee/home $ cd config
.../OC4J/j2ee/home/config $ vi system-jazn-data.xml

Suchen Sie in der XML-Datei system-jazn-data.xml den Eintrag für oc4jadmin und tragen Sie das neue Passwort mit einem führenden Ausrufezeichen wie folgt unter credentials ein: 

<user>
  <name>oc4jadmin</name>
  <display-name>OC4J Administrator</display-name>
  <guid>84E9EB00B5CC11DB9F58212C13902763</guid>
  <description>OC4J Administrator</description>
  <credentials>!mapviewer</credentials>
</user>

Speichern Sie die Datei und starten Sie den MapViewer neu.

Einrichten des Map Cache

Nach erfolgreichem Login in den MapViewer Administrationsbereich navigieren Sie links oben zu Manage Map Caches, von dort aus wählen Sie Create zum Einrichten eines neuen Map Cache aus.

Neuen Map Cache einrichten (Create Map Cache)

Abbildung 4: Neuen Map Cache einrichten (Create Map Cache)

  • Wählen Sie als Internal als Map Source aus - die Kartendaten kommen aus der Datenbank.
  • Den Namen des Map Cache können Sie frei wählen. Nehmen Sie für dieses Beispiel WELTKARTE.
  • Wählen Sie world als Data Source aus. Diese Data Source haben Sie mit dem Einrichten des MapViewer in der vorletzten Ausgabe erstellt.
  • Nun füllt sich die nächste Auswahlliste Base Map automatisch - Wählen Sie hier die einzig verfügbare Base Map WORLD_SAMPLE aus.
  • Die Hintergrundfarbe können Sie frei wählen oder nichts tun.
  • Belassen Sie die Einstellungen für Cache Storage und Zoom Levels bei den voreingestellten Werten.
  • Tragen Sie 1000000 als Minimum Map Scale und 15000000 bei Maximum Map Scale ein.
  • In den Karten der letzten beiden Ausgaben ergab sich durch die Verwendung von Längen und Breitengraden eine etwas verzerrte Darstellung der Deutschlandkarte. Geben Sie daher als Koordinatensystem (SRID) den Wert 82027 anstelle von 8307 ein. Dadurch wird Deutschland in der Karte so aussehen, wie Sie es gewohnt sind.
  • Geben Sie sowohl für Min X als auch für Min Y den Wert 0, und für Max X und Max Y den Wert 10000000 ein.
  • Die restlichen Angaben können Sie auf den Voreinstellungen belassen.
Angaben für den neuen Map Cache

Abbildung 5: Angaben für den neuen Map Cache

Wenn Sie fertig sind, klicken Sie unten auf die Schaltfläche Submit. Damit ist der Map Cache eingerichtet und Sie können Oracle Maps nun in Ihre Application Express-Anwendung integrieren.

Oracle Maps in Application Express einbinden

Arbeiten Sie auch dieses Mal mit der Anwendung, die bereits in den letzten Ausgaben entstanden ist - fügen Sie ihr eine neue Seite hinzu und versehen Sie diese mit einer neuen Region Karte vom Typ HTML. Diese Seite sollte dann wie folgt aussehen:

Anwendungsseite: (noch) ohne Oracle Maps

Abbildung 6: Anwendungsseite: (noch) ohne Oracle Maps

Navigieren Sie nun wiederum zum Quelltext der HTML-Region und hinterlegen Sie folgenden Code: 

<div id="map" style="left:0; top:0;width: 600px; height: 400px">
</div>

Der nötige JavaScript-Code wird im Seiten-Header hinterlegt: 

<script src="/mapviewer/fsmc/jslib/oraclemaps.js"></script>
<script type="text/javascript">
  var baseURL  = "http://"+document.location.host+"/mapviewer";
  var mapCenterLon = 10;
  var mapCenterLat = 50;
  var mapZoom      = 0;

  var mapview;
  var mpoint = MVSdoGeometry.createPoint(mapCenterLon,mapCenterLat,8307);

  function show_map() {
    mapview = new MVMapView(document.getElementById("map"),baseURL);      
    var basemap  = new MVBaseMap("world.WELTKARTE");
    mapview.addBaseMapLayer(basemap);
    mapview.setCenter(mpoint);
    mapview.setZoomLevel(mapZoom);
    mapview.addNavigationPanel("WEST");
  
    mapview.display();
  }
</script>

Rufen Sie die erzeugte JavaScript-Funktion show_map() im onLoad-Handler des HTML Body Tags auf (Sie müssen zusätzlich das Feld Cursor-Fokus auf Cursor nicht fokussieren stellen):

Aufruf der JavaScript-Funktion im HTML Body Tag
Cursor-Fokus in den Seitenattributen nicht setzen

Aufruf der JavaScript-Funktion im HTML Body Tag und Einrichten des Cursor-Fokus

Die Dokumentation für die JavaScript-Bibliothek ist auf Ihrem MapViewer-Server bereits vorhanden. Geben Sie einfach im Browser folgende URL ein: 

http://[mapviewer-host]:[port]/mapviewer/fsmc/apidoc/index.html

Dort finden Sie eine genaue Beschreibung der hier verwendeten und aller verfügbaren JavaScript-Aufrufe. Starten Sie die Seite nun. Wenn Sie den Kartenaufbau verfolgen, fällt Ihnen wahrscheinlich sofort auf, dass die Karte aus mehreren Kacheln besteht. Sie können den Kartenausschnitt nun bequem mit der Maus per Drag & Drop verschieben oder über die Navigationsleiste links oben verschieben - auch das Herein- und Herauszoomen ist mit der Navigationsleiste ganz einfach: Probieren Sie es aus!

Das Ergebnis: Deutschlandkarte mit Oracle Maps - in Application Express

Abbildung 7: Das Ergebnis: Deutschlandkarte mit Oracle Maps - in Application Express

Oracle Maps ermittelt zunächst, welche Kacheln nötig sind, um den angeforderten Kartenausschnitt darzustellen. Ist die Kachel bereits im Map Cache enthalten, so wird sie sofort ausgeliefert, andernfalls wird sie zuerst erstellt. Aus diesem Grund dauert der erste Abruf einer Kachel stets länger.

Um diese Wartezeiten für den Endanwender zu vermeiden, besteht die Möglichkeit, die Kacheln im voraus zu generieren. Wenn Sie im Administrationsbereich des MapViewer zu Manage Map Caches und dort in den Bereich Manage navigieren, sehen Sie den Dialog, der in Abbildung 8 dargestellt ist.

Administrationsbereich des MapViewers: Kacheln im Voraus berechnen

Abbildung 8: Administrationsbereich des MapViewers: Kacheln im Voraus berechnen

Stellen Sie die Zoom-Level und den Kartenausschnitt ein, für den Sie die Kacheln vorberechnen möchten; klicken Sie anschließend auf Submit. Die Kacheln werden dann im Hintergrund berechnet - bis der MapViewer damit fertig ist, kann allerdings einige Zeit vergehen.

Dynamische Elemente hinzufügen: Features Of Interest!

Im letzten Teil geht es nun darum, die in der letzten Ausgabe per Zufallsgenerator erstellten Kunden ebenfalls in die Karte einzubinden. In Oracle Maps geschieht dies durch die Features Of Interest (FOI).

Features Of Interest sind allerdings nicht völlig dynamisch - sie müssen vorher in der Datenbank als MapViewer Theme definiert sein. Dies kann mit dem im Oracle Technet erhältlichen Werkzeug Oracle Map Builder erfolgen (Abbildung 9).

Kartendefinitionen mit dem Oracle Map Builder

Abbildung 9: Kartendefinitionen mit dem Oracle Map Builder

Mit dem MapBuilder kann aus Aussehen der Karten komplett selbst definiert werden. Die Styles definieren, wie etwas gezeichnet wird, die Themes legen fest, wo die Daten herkommen und welcher Style zur Darstellung verwendet wird. Die Base Maps bestehen schließlich aus mehreren übereinandergelegten Themes und bilden so eine vordefinierte Karte. Sie können sich mit dem MapBuilder auch die bereits vorhandenen Kartendefinitionen des NAVTEQ World Sample ansehen und ggfs. verändern.

Map Caches für Oracle Maps können nur aufgrund von definierten Base Maps erstellt werden. Features Of Interest müssen ein vordefiniertes Theme als Grundlage haben. Insofern bietet Oracle Maps zwar wesentlich intuitivere Navigation und bessere Performance, die Kartendarstellung kann jedoch nicht ganz so flexibel und dynamisch gestaltet werden wie mit der MapViewer PL/SQL-API, welche in den letzten beiden Ausgaben vorgestellt wurde.

Das Theme, welches für die dynamische Darstellung der Kunden benötigt wird, soll nun durch ein einfaches SQL INSERT erstellt werden. Setzen Sie das folgende SQL-Kommando von SQL*Plus aus (nicht dem SQL Workshop) ab. Melden Sie sich im SQL*Plus mit dem Parsing Schema Ihrer Application Express-Anwendung an. 

insert into user_sdo_themes (
  NAME,
  DESCRIPTION,
  BASE_TABLE,
  GEOMETRY_COLUMN,
  STYLING_RULES
) values (
  'KUNDEN',
  null,
  'KUNDEN',
  'LOKATION',
  '<?xml version="1.0" standalone="yes"?>
     <styling_rules>
       <hidden_info>
         <field column="ID" name="#"/>
         <field column="NAME" name="Name"/>
       </hidden_info>
       <rule>
         <features style="M.CYAN PIN"> </features>
       </rule>
     </styling_rules>'
)
/

Navigieren Sie in Ihrer Application Express-Anwendung wieder zum Seiten-Header und ändern Sie den JavaScript-Code wie folgt um: 

<script src="/mapviewer/fsmc/jslib/oraclemaps.js"></script>
<script type="text/javascript">
  var baseURL  = "http://"+document.location.host+"/mapviewer";
  var mapCenterLon = 10;
  var mapCenterLat = 50;
  var mapZoom      = 0;

  var mapview;
  var mpoint = MVSdoGeometry.createPoint(mapCenterLon,mapCenterLat,8307);

  function show_map() {
    mapview = new MVMapView(document.getElementById("map"),baseURL);      
    var basemap  = new MVBaseMap("WORLD.WELTKARTE");
    mapview.addBaseMapLayer(basemap);
    mapview.setCenter(mpoint);
    mapview.setZoomLevel(mapZoom);
    mapview.addNavigationPanel("WEST");
    
    var foi_kunden = new MVThemeBasedFOI('foi_kunden','world.kunden');
    foi_kunden.setVisible(false);
    mapview.addThemeBasedFOI(foi_kunden);   
  
    mapview.display();
  }
  
  function setVisible(foi_name) {
    var foi = mapview.getThemeBasedFOI(foi_name); 
    foi.setVisible(!foi.isVisible());
  }
</script>

Um einen Link als "Schalter" für die Kunden einzurichten, ändern Sie den HTML-Code der Region Karte wie folgt: 

<div id="map" style="left:0px; top:0px; width:600px; height: 400px">
</div>
<div>
<a href="javascript:setVisible('foi_kunden');">Kunden ein/ausblenden</a>
</div>

Starten Sie die Seite anschließend neu. Klicken Sie dann einmal auf den Link Kunden ein/ausblenden unterhalb der Karte - dann sollte für jeden Kunden eine Stecknadel auf Ihrer Karte erscheinen. Mit nochmaligem Klick auf den Link verschwinden die Stecknadeln wieder.

Das Ergebnis: Die Karte mit dynamisch ein- und ausblendbaren Informationen zu Kunden

Abbildung 10: Das Ergebnis: Die Karte mit dynamisch ein- und ausblendbaren Informationen zu Kunden

Das ist jedoch noch nicht alles. Wenn Sie auf eine der Stecknadeln klicken, wird ein Information Window mit Details zu diesem Kunden eingeblendet - im Moment sind dies lediglich die ID und der Name - mehr Informationen gibt es zu diesen zufällig generierten "Kunden" nicht. Im einer "realen" Applikation können auf diesem Weg weitere Informationen wie die komplette Adresse oder Angaben zum Umsatz angezeigt werden.

Über das hier gesehene hat Oracle Maps noch wesentlich mehr Funktionalität - wenn Sie sich durch die oben erwähnte Dokumentation zur JavaScript-API blättern, erfahren Sie mehr über Möglichkeiten wie ...

  • Markieren eines Rechtecks als neuen Kartenausschnitt
  • Information Windows mit selbstdefiniertem Inhalt (bspw. Bilder)
  • Erstellen neuer Geometrien und Speichern derselben in der Datenbank
  • ...

Mit dieser Ausgabe endet das Geodaten-Tutorial (vorerst). In dieser und den letzten Ausgaben haben Sie erfahren, wo Sie Geodaten zum Testen herbekommen (NAVTEQ World Sample), wie Sie diese in die Datenbank laden, räumliche Berechnungen darauf durchführen, als Karte darstellen und schließlich mit Oracle Maps eine benutzerfreundliche Navigation in dieser Karte ermöglichen.

Wenn Sie mehr über die Geodaten-Technologie erfahren möchten, finden Sie hier weitere Informationen:

Zurück zur Community-Seite