[PATCH] Moved D4E Ocean to new layout
Wald Commits
scm-commit at wald.intevation.org
Mon Mar 31 18:12:49 CEST 2014
# HG changeset patch
# User Tom Gottfried <tom at intevation.de>
# Date 1396282365 -7200
# Node ID 68f49d59b165ceeda487846a93640cf5c1fab40b
# Parent abcfb1f3d11f40e2975d08453e8799c5825e4d85
Moved D4E Ocean to new layout.
diff -r abcfb1f3d11f -r 68f49d59b165 gnv/gnv.html
--- a/gnv/gnv.html Mon Mar 31 18:06:11 2014 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,189 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml"><head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <meta name="keywords" content="Dive4Elements,Karten, Diagramme, Modelle, Fachdaten, Analyse, WMS, Visualisierung">
- <link rel="stylesheet" type="text/css" href="gnv_files/style.css">
- <title>Dive4Elements</title>
- </head>
-
-<body>
-<div class="wrapper">
-
-<div id="intro">
-<h2>Dive4Elements</h2>
-<p>Webanwendung für Karten, Diagramme und Modelle</p>
-</div>
-
-<div id="main">
-<a name="was-ist-dive4elements"></a>
-<h2>Was ist Dive4Elements?</h2>
-<p> Dive4Elements ist eine datenbankbasierte Webapplikation zur
-raum-zeitlichen Analyse von Fachdaten der 4 Elemente (Feuer, Wasser,
-Luft und Erde).
-<i>Dive</i> steht für <i>Digging, Investigating, Viewing, Exporting</i>.
-</p>
-
-<p>Dive4Elements gewährt webbasiert den Zugriff auf Datenmodelle in
-einem zentralen <b>Datawarehouse</b> und bietet die Möglichkeit zur
-Analyse, Visualisierung der Daten sowie Exportmöglichkeiten in offene
-Formate.</p>
-
-<p>
-Dive4Elements kombiniert die folgenden <b>Vorteile</b>:
-</p><ul>
- <li> Einheitlicher Aufbau fachlicher Workflows</li>
- <li> Einheitliche Projektverwaltung für Karten und Diagramme</li>
- <li> Einheitliche Verwaltung für Nutzereingaben</li>
- <li> Fachbezogene Sichten auf zentrale und fachbezogene
- Datenbestände</li>
- <li>Eingabeunterstützung durch unterschiedliche Widgets: Karten,
- Tabellen und Eingabefelder</li>
-</ul>
-<p></p>
-
-<a name="visualisierung-analyse"></a>
-<h2>Visualisierung & Analyse</h2>
-
-<p>Mit adäquaten Diagrammtypen und Kartendarstellungen können
-raum-zeit-bezogene Daten visualisiert und miteinander verglichen
-werden. Diese ausschließlich über einen Browser parametrisierten
-Analysen ermöglichen Darstellungen von Zeitserien, Vertikal- und
-Horizontalprofilen, Profilschnitten, Horizontalschnitten, Histogrammen
-und vom Anwender generierten Kartenebenen.</p>
-
-<p>Um derartige Ergebnisse visualisieren zu können, wird zwischen
-Datenzugriff und den unterschiedlichen Ausgaben ein
-Prozessierungsschritt zwischengeschaltet. Hier werden sowohl 2D- und
-3D-Interpolationen als auch statistische Analysen gerechnet.
-Klassifizierungen und Isoliniendarstellungen werden ermittelt;
-Geometriedaten werden ausgeschnitten bzw. geclippt. Die jeweiligen
-Ergebnissen stehen über <b>offene Formate und Schnittstellen</b> zur
-weiteren Nutzung in unterschiedlichen Kontexten zur Verfügung:</p>
-
-<ul>
- <li><b>CSV-Format:</b> Weiterverarbeitung in einer
- Tabellenkalkulation</li>
- <li><b>ODV-Format:</b> Weiterverarbeitung in der Fachsoftware OceanData
- View des Alfred-Wegner Instituts</li>
- <li><b>PNG/JPG-Format:</b> Einbindung in Publikationen oder Webseiten</li>
- <li><b>PDF-Format:</b> Der Export liefert eine Vektordarstellung, so dass
- diese u.a. für hochaufgelöste Druckprodukte genutzt werden
- können.</li>
- <li><b>SVG-Format:</b> Ein offenes und standardisiertes Vektorformat des
- W3C Consortiums zur Einbindung in Zeichenprogramme, um
- nutzerspezifische Darstellungen für hochaufgelöste Druckprodukte
- herstellen zu können.</li>
- <li><b>Shape-Format:</b> Ausgabe von Geometrie- und Sachdaten zur
- weiteren Verarbeitung in anderen GIS-Programmen</li>
- <li><b>WMS-Schnittstelle:</b> Publizieren der Kartendarstellungen für die
- Integration in Geoportale oder desktopbasierte GI-Systeme</li>
-</ul>
-
-<p>Dive4Elements kann sowohl zur alltäglichen Arbeit als auch
-Durchführung von umfangreicheren wissenschaftlichen Analysen an jedem
-Arbeitsplatz über einen Browser genutzt werden. Durch die
-o.g. Ausgabemöglichkeiten über offene Formate und
-Schnittstellen können die Ergebnisse in weitere Arbeitsprozesse
-eingebunden werden.</p>
-
-<br> Dive4Elements (1. Generation) wird vom <a href="http://www.bsh.de/">Bundesamt für Seeschifffahrt und Hydrographie</a> in Hamburg
-unterstützt.
-</p>
-
-<a name="entwicklung-download"></a>
-<h2>Entwicklung & Download</h2>
-<p>Dive4Elements ist Freie Software. Der aktuelle Quellcode ist verfügbar in
-einem <a href="http://wald.intevation.org/scm/?group_id=57">SCM-Repository</a>.
-</p>
-
-<p>
-<a href="http://lists.wald.intevation.org/mailman/listinfo/dive4elements-commits">
-SCM-Commit-Mailingliste abonnieren »</a>
-</p>
-
-
-<a name="technische-daten"></a>
-<h2>Technische Daten</h2>
-<ul>
- <li>Nutzergeführte Fachdatenauswahl / Parameterisierung und
- Speicherung</li>
- <li>Templatebasierte Diagrammkomponente zur Visualisierung von
- punkt-, linien-, flächenhafte Daten u.a. mit Isolinien</li>
- <li>Rechenkern mit Interpolationsmethoden und Statistik</li>
- <li>WMS-Generator, WMS-Dienst mit integriertem
- OpenLayers-basierten Karten-Viewer</li>
- <li>Umfangreiche Exportmöglichkeiten: CSV, ODV, PNG/JPEG,
- vektorisierte PDFs, SVG, Shape</li>
- <li>Durchgängige Mehrsprachigkeit von GUI bis Diagramm</li>
- <li>Durchgängig auf Freier Software realisiert</li>
- <li>Implementierung in Java (Server mit sog. REST-Schnittstelle,
- WebClient mit Google Web Toolkit)</li>
- <li>Nutzung von UMN MapServer als Kartenserver</li>
- <li><a href="http://wald.intevation.org/projects/wsplgen/">WSPLGEN</a>
- als sog. Wasserspiegellagengenerator</li>
- <li>Anbindung gegen Oracle und PostgreSQL/PostGIS Datenbanken möglich</li>
-</ul>
-
-</div> <!-- end main -->
-
-
-<div id="sidebar"><h2><a href="http://dive4elements.org/index.html">Dive4Elements</a></h2>
- <h3>Inhalt</h3>
- <ul style="list-style-type: square; margin-left:-25px;
- line-height: 23px;">
- <li><a href="#was-ist-dive4elements">Was ist Dive4Elements?</a></li>
- <li><a href="#visualisierung-analyse">Visualisierung & Analyse</a></li>
- <li><a href="#entwicklung-download">Entwicklung & Download</a></li>
- <li><a href="#technische-daten">Technische Daten</a></li>
- </ul>
-</div>
-
-<!--div id="sidebar"><h2><a href="river.html">Dive4Elements River</a></h2>
- <h3>Inhalt</h3>
- <ul style="list-style-type: square; margin-left:-25px;
- line-height: 23px;">
- <li><a href="river.html#was-ist-dive4elements-river">Was ist Dive4Elements River?</a></li>
- <li><a href="river.html#visualisierung-analyse">Visualisierung & Analyse</a></li>
- <li><a href="river.html#entwicklung-download">Entwicklung & Download</a></li>
- <li><a href="river.html#technische-daten">Technische Daten</a></li>
- </ul>
-</div-->
-
-<div id="sidebar"><h3>Screenshots</h3>
- <a href="img/screenshot1.png"><img src="gnv_files/screenshot1_small.png" width="220px"></a>
- <small>Zum Vergrößern auf das Bild klicken</small>
- <p>Webbasierte und graphische Nutzeroberfläche
- von Dive4Elements mit der Darstellung der klassifizierten
- Temperaturverteilung über die Tiefe in der Ostsee, dargestellt in
- einem Profilschnitt</p>
- <br>
- <a href="img/screenshot2.png"><img src="gnv_files/screenshot2_small.png"></a>
- <small>Zum Vergrößern auf das Bild klicken</small>
- <p>Kartenausschnitt, mit dynamisch errechneter horizontaler
- Temperaturverteilung in Nord- und Ostsee; dargestellt als
- Horizontalschnitt in Form eines temporär erzeugten
- WMS-Dienstes</p>
-</div>
-
-<!--div id="sidebar" style="line-height: 20px"><h3>Kontakt / Impressum</h3>
- <b>Intevation GmbH</b><br>
- Neuer Graben 17<br>
- 49074 Osnabrück<br>
- <a href="http://www.intevation.de" target="_blank">www.intevation.de</a><br>
- <a href="mailto:intevation at intevation.de">intevation at intevation.de</a>
-</div-->
-
-<br clear="all">
-</div> <!-- end wrapper -->
-
-<div id="footer">
- <br>
- <div id="sitemap">
- <p>Dive4Elements ist lizensiert unter der <a href="http://www.gnu.org/licenses/lgpl-2.1.html">GNU LGPL
- v2.1</a>.</p>
- © 2011 Intevation GmbH
- </div>
-</div>
-
-
-</body></html>
diff -r abcfb1f3d11f -r 68f49d59b165 gnv/gnv_files/screenshot1_small.png
Binary file gnv/gnv_files/screenshot1_small.png has changed
diff -r abcfb1f3d11f -r 68f49d59b165 gnv/gnv_files/screenshot2_small.png
Binary file gnv/gnv_files/screenshot2_small.png has changed
diff -r abcfb1f3d11f -r 68f49d59b165 gnv/gnv_files/style.css
--- a/gnv/gnv_files/style.css Mon Mar 31 18:06:11 2014 +0200
+++ /dev/null Thu Jan 01 00:00:00 1970 +0000
@@ -1,102 +0,0 @@
-/* Styles for the DIVE4elements Website */
-
-body {
- font-family: arial, helvetica, sans-serif;
- font-size: 13px;
- background: #FFFFFF url('img/page_bg.png') repeat-x;
- color: #333333;
- margin: 0;
- padding:0px;
-}
-
-a {
- color: #b51a22;
- text-decoration: none;
-}
-
-a:hover {
- text-decoration: underline;
-}
-
-img {
- border: 0px;
-}
-
-.wrapper {
- width: 900px;
- margin: 0 auto;
- text-align: left;
-}
-
-#intro {
- padding: 30px 250px 20px 20px;
-}
-
-#intro h2 {
- font-family: georgia, times, serif;
- font-size: 30px;
- font-weight: normal;
- color: #333333;
- margin: 0px;
-}
-
-#intro p {
- color: #555555;
- font-size: 14px;
- font-weight: normal;
- line-height: 26px;
- margin: 10px 0 0;
- padding: 0;
-}
-
-#main {
- float: left;
- padding: 0px 0px 0px 20px;
- width: 600px;
-}
-
-#main h2 {
- font-size: 22px;
- font-weight: normal;
- color: #333333;
- margin: 30px 0px 10px 0px;
- padding: 0px;
- clear: both;
-}
-
-#main p, #main li{
- color: #444444;
- line-height: 20px;
- margin: 0px 0px 10px;
-}
-
-#sidebar {
- -moz-border-radius: 10px 10px 10px 10px;
- background: none repeat scroll 0 0 #EBEBEB;
- border: 1px solid #99b4c9;
- float: right;
- margin-top: 34px;
- padding: 20px 20px 15px;
- width: 220px;
-}
-
-#sidebar h3 {
- color: #333333;
- margin: 1px 0px 10px 0px;
-}
-#footer {
- background: none repeat scroll 0 0 #EBEBEB;
- color: #333333;
- font-size: 11px;
- height: 50px;
- margin-top: 30px;
- padding-bottom: 20px;
- text-align: center;
- width: 100%;
-}
-#sitemap {
- margin: auto;
- text-align: left;
- width: 900px;
- padding-left: 40px;
-}
diff -r abcfb1f3d11f -r 68f49d59b165 gnv/img/screenshot1.png
Binary file gnv/img/screenshot1.png has changed
diff -r abcfb1f3d11f -r 68f49d59b165 gnv/img/screenshot2.png
Binary file gnv/img/screenshot2.png has changed
diff -r abcfb1f3d11f -r 68f49d59b165 img/gnv_karte.png
Binary file img/gnv_karte.png has changed
diff -r abcfb1f3d11f -r 68f49d59b165 img/gnv_profil.png
Binary file img/gnv_profil.png has changed
diff -r abcfb1f3d11f -r 68f49d59b165 ocean.html
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/ocean.html Mon Mar 31 18:12:45 2014 +0200
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Dive4Elements</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta charset="utf-8">
+ <meta name="description" content="">
+ <meta name="author" content="Ariane Brörmann">
+ <!-- Bootstrap -->
+ <link href="bootstrap-3.1.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="css/style.css" rel="stylesheet">
+
+ <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+ <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+ <!--[if lt IE 9]>
+ <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+ <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+ <![endif]-->
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+ <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+ <!-- Include all compiled plugins (below), or include individual files as needed -->
+ <script src="bootstrap-3.1.0/dist/js/bootstrap.min.js"></script>
+ <script src="js/dive4elements.js"></script>
+ </head>
+ <body>
+ <div class="container">
+ <!--#include file="header.html" -->
+ <div class="row row-dive4elements row-dive4elements-right">
+ <!--#include file="ocean_body.html" -->
+ </div>
+ <!--#include file="footer.html" -->
+ </div> <!-- /container -->
+ </body>
+</html>
diff -r abcfb1f3d11f -r 68f49d59b165 ocean_body.html
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/ocean_body.html Mon Mar 31 18:12:45 2014 +0200
@@ -0,0 +1,46 @@
+<div class="col-xs-12">
+<div class="jumbotron">
+ <h3>Dive4Elements Ocean</h3>
+ <p class="lead">Dive4Elements Ocean ist eine datenbankbasierte Webapplikation
+ zur raum-zeitlichen Analyse von ozeanographischen Fachdaten.
+ Die Entwicklung wurde unter dem Namen Generischer Viewer (GNV)
+ vom <a href="http://www.bsh.de" target="_blank">Bundesamt für Seeschifffahrt und Hydrologie (BSH)</a> unterstützt.
+
+ <!-- Carousel -->
+ <!--#include file="ocean_carousel.html" -->
+</div><!-- /jumbobutton-->
+
+<div class="marketing">
+ <div>
+ <h4>Was ist Dive4Elements Ocean?</h4>
+ <p>Dive4Elements Ocean kombiniert vorgegebene Workflows (Arbeitsabläufe)
+ zur Ergebnis-/Informationsermittlung mit fachlich sinnvollen
+ Möglichkeiten zur Ausgabe der ozeanographischen Ergebnisse.</p>
+
+ <h4>Verwendete Technologien</h4>
+ <p>
+ <ul>
+ <li>Dive4Elements als Framework</li>
+ <li><a href="http://www.postgresql.org/" target="_blank">PostgreSQL</a>/<a href="http://postgis.net/" target="_blank">PostGIS</a> und Oracle/Spatial über Hibernate</li>
+ <li>WMS-Dienste über <a href="http://mapserver.org/" target="_blank">MapServer</a></li>
+ <li><a href="http://openlayers.org/" target="_blank">OpenLayers</a> zur Darstellung interaktiver Karten</li>
+ <li><a href="http://www.mapfish.org/doc/print/" target="_blank">Mapfish Print</a> ermöglicht den Ausdruck dieser Karten als PDF</li>
+ <li><a href="http://www.gwtproject.org/" target="_blank">GWT</a>/<a href="http://code.google.com/p/smartgwt/" target="_blank">SmartGWT</a> für eine moderne AJAX-basierte Web-Oberfläche</li>
+ <li><a href="http://www.geotools.org/" target="_blank">GeoTools</a> für die standardkonforme Verarbeitung von Geo-Daten</li>
+ <li>Anbindung an Wiki-Technologie (realisiert mit <a href="http://moinmo.in/" target="_blank">MoinMoin</a>) zur Online-Dokumentation</li>
+ </ul>
+ </p>
+ <h4>Freie Software</h4>
+ <p>
+ Dive4Elements Ocean gewährt die
+ <a href="http://fsfe.org/about/basics/freesoftware.en.html" target="_blank">vier Grundfreiheiten Freier Software</a> und steht unter der <a href="http://www.gnu.org/licenses/lgpl-2.1.html" target="_blank">GNU Lesser General Public License (LGPL), Version 2.1</a> oder später.
+ <ul>
+ <li>Die Freiheit, das Programm für jeden Zweck auszuführen.</li>
+ <li>Die Freiheit, die Funktionsweise eines Programms zu untersuchen, und es an seine Bedürfnisse anzupassen.</li>
+ <li>Die Freiheit, Kopien weiterzugeben und damit seinen Mitmenschen zu helfen.</li>
+ <li>Die Freiheit, ein Programm zu verbessern, und die Verbesserungen an die Öffentlichkeit weiterzugeben, sodass die gesamte Gesellschaft profitiert.</li>
+ </ul>
+ </p>
+ </div>
+</div><!-- /row marketing -->
+</div>
diff -r abcfb1f3d11f -r 68f49d59b165 ocean_carousel.html
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/ocean_carousel.html Mon Mar 31 18:12:45 2014 +0200
@@ -0,0 +1,26 @@
+ <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="10000">
+ <ol class="carousel-indicators">
+ <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
+ <li data-target="#myCarousel" data-slide-to="1"></li>
+ </ol>
+ <!-- Carousel items -->
+ <div class="carousel-inner">
+ <div class="item active">
+ <img src="img/gnv_profil.png" alt="Profilschnitt" class="img-responsive">
+ <div class="carousel-caption">
+ <p>Profilschnitt der klassifizierten Temperaturverteilung über die Tiefe in der Ostsee.</p>
+ </div>
+ </div>
+ <div class="item">
+ <img src="img/gnv_karte.png" alt="Horizontalschnitt" class="img-responsive">
+ <div class="carousel-caption">
+ <p>Kartenausschnitt mit dynamisch errechnetem Horizontalschnitt
+ der Temperaturverteilung in Nord- und Ostsee
+ (temporär erzeugter WMS-Dienst)</p>
+ </div>
+ </div>
+ </div>
+ <!-- Carousel nav -->
+ <a class="left carousel-control" data-slide="prev" href="#myCarousel"><span class="glyphicon glyphicon-chevron-left"></span></a>
+ <a class="right carousel-control" data-slide="next" href="#myCarousel"><span class="glyphicon glyphicon-chevron-right"></span></a>
+ </div><!-- /myCarousel -->
More information about the Dive4Elements-commits
mailing list