The ClimateCharts project is a Web Application divided into two parts:
- The client-side webapp called "climatecharts-client", implemented in HTML, CSS and JavaScript
- Three server-side applications implemented in Java: 2.1 "gazetteer": translates a set of GPS coordinates into a location name (e.g. "Weimar, Thüringen, Deutschland") 2.2 "thredds": the THREDDS Data Server (TDS) provides access to the actual climate data (temperature and precipitation per year) 2.3 "weatherstations": provides access to the database of weatherrstations, allows for requesting all at once and the climate data for one station in one time period
The client-side webapp has two versions:
- The main master version, for everybody accessible and to be promoted: http://climatecharts.net
- The test development version, for the testers, coders and other affiliates, not to be promoted: http://climatecharts.net/develop
As soon as the develop version is accepted by all affiliates, it replaces the current master version.
The Client-side webappp can be found here: https://github.com/GeoinformationSystems/climatecharts [email protected]:GeoinformationSystems/climatecharts.git
The Server-side applications can be found here: 2.1. gazetteer https://github.com/GeoinformationSystems/gazetteer [email protected]:GeoinformationSystems/gazetteer.git 2.2. thredds to do 2.3. weatherstations https://github.com/GeoinformationSystems/weatherstations [email protected]:GeoinformationSystems/weatherstations.git
Both the client and the server applications can / should be developed locally and then deployed on the server. The folders for the local applications can be set as desired, but this is the setup I chose:
Project folder for the source code: /home/$USER/Projects/ClimateCharts |- climatecharts/ // Client-side webappp (HTML, CSS, JS) |- gazetteer/ // Server-side application (Java) |- thredds/ // Server-side application (Java) |- weatherstations/ // Server-side application (Java)
Development folder for Eclipse workspace, local tomcat instance and other development-related stuff /home/$USER/Development |- climatecharts_setup // stuff folder for readme, configuration files, test files, exported *.war files, archive for last working versions, ... |- Eclipse_workspace // actual workspace for ecplise |- TDS // thredds data server |- Tomcat_local // local Tomcat8 instance
Install git and connect over ssh $ sudo apt-get install apache2 follow this instruction: https://help.github.com/articles/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent/
Install Apache Web Server $ sudo apt-get install apache2
Get the source code in your home folder and switch to working branch $ cd ~/Projects/ClimateCharts $ git clone [email protected]:GeoinformationSystems/climatecharts.git $ git checkout develop
Create a symbolic link to the directory of the Apaches webapps $ sudo ln -s /home/$USER/Projects/ClimateCharts/climatecharts /var/www/html/
Access the website through a normal Web Browser through port 80 (default port so it can be omitted): http://localhost/climatecharts/
If you get the 403 error (Permission denied), that can have several causes. It is most likely a permission problem. It is important to note that when Apache follows symlinks, the path must be accessible all the way down by the calling user. This means you need execute access in the folder you are linking and the parent folders above it: chmod o+x /home/$USER /home/$USER/Projects /home/$USER/Projects/ClimateCharts /home/$USER/Projects/ClimateCharts/climatecharts
Currently (status: August 2017) ECMA6 is out there. It is amazing, since it enables class-based object-oriented programming and that just awesome! However, it is not accepted widely among browsers. If that is ever the case, just ingnore this section :-)
The javascript source code of the program is written in ECMA6. For the browsers to understand it well, it has to be compiled to ECMA5. That needs babel, a node.js module.
Get node.js and set it up $ sudo apt-get install npm $ sudo ln -s /usr/bin/nodejs /usr/bin/node
Install babel and preset into your environment $ cd /home/$USER/Development $ sudo npm install --save-dev babel-cli $ sudo npm install --save-dev babel-preset-env
Now the compilation should work. Test it by executing the build command in the proogram folder $ cd /home/$USER/Projects/ClimateCharts/climatecharts $ ./build.sh
If that executes by printing many lines of compilation from a source/ to a build/ folder and it ends without an error message, everything should be fine from here on.
Install Java and its Runtime Environment $ sudo apt-get install openjdk-8-jdk openjdk-8-demo openjdk-8-doc openjdk-8-jre-headless openjdk-8-source
Install Eclipse Java EE (Mars2) as the desired IDE -> http://www.eclipse.org/downloads/packages/eclipse-ide-java-ee-developers/mars2 Download from here to /home/$USER/Downloads: http://www.eclipse.org/downloads/download.php?file=/technology/epp/downloads/release/mars/2/eclipse-jee-mars-2-linux-gtk-x86_64.tar.gz Extract the folder $ cd ~/Downloads $ tar xf eclipse-jee-mars-2-linux-gtk-x86_64.tar.gz $ rm eclipse-jee-mars-2-linux-gtk-x86_64.tar.gz Move to program folder $ sudo mv /home/$USER/Downloads/eclipse /etc/ Create Launcher entry $ sudo touch /usr/share/applications/eclipse.desktop $ gksudo gedit /usr/share/applications/eclipse.desktop Copy the following content in it, save and leave [Desktop Entry] Encoding=UTF-8 Name=Eclipse IDE Exec=/etc/eclipse/eclipse Icon=/etc/eclipse/icon.xpm Type=Application Categories=Development;
Install Tomcat8 as the web server on the localhost $ sudo apt-get install tomcat8
Install a local Tomcat v8.0 instance that can be used by Eclipse. Download Tomcat version 8.0.46 to the Download folder (a newer version fo Tomcat is already available, bvut it works nicely with the old one. And never change a running system :-) last update: August 2017). $ cd ~/Downloads $ wget http://mirror.softaculous.com/apache/tomcat/tomcat-8/v8.0.46/bin/apache-tomcat-8.0.46.tar.gz $ tar xf apache-tomcat-8.0.46.tar.gz $ rm apache-tomcat-8.0.46.tar.gz $ mv apache-tomcat-8.0.46/ ~/Development/Tomcat_local
Now there are two different Tomcat servers /usr/share/tomcatX -> system-wide Tomcat installation /home/$USER/Development/Tomcat_local -> local Tomcat installation used by Eclipse
Use Tomcat8 Server in Eclipse and connect local webapps to it Window -> Show View -> Servers Create New Server Apache -> Tomcat v8.0 Server -> Next > Tomcat installation directory: /home/$USER/Development/Tomcat_local JRE: java-8-openjdk-amd64 Next > Add application from Available to Configured Finish
Troubleshooting: If it is impossible to use Tomcat v8.0 ("Next" and "Finish" greyed out), close Eclipse and delete the following two files: $ rm /home/$USER/Development/Eclipse_workspace/.metadata/.plugins/org.eclipse.core.runtime/.settings/org.eclipse.jst.server.tomcat.core.prefs $ rm /home/$USER/Development/Eclipse_workspace/.metadata/.plugins/org.eclipse.core.runtime/.settings/org.eclipse.wst.server.core.prefs
There is another alternative: Install and create a real local instance of tomca8. Find the reference here: http://askubuntu.com/questions/310767/how-should-i-install-apache-tomcat-7-for-use-with-eclipse/464866#464866
Get source code of the gazetteer application $ cd /home/$USER/Projects/ClimateCharts $ git clone [email protected]:GeoinformationSystems/gazetteer.git
Open Eclipse and import the project File -> Import Maven -> Existing Maven Projects -> Next > Root Directory: /home/$USER/Projects/ClimateCharts/gazetteer
Setup the Tomcat Server Window -> Preferences Server -> Runtime Environments -> Add... Apache -> Apache Tomcat v8.0 Name: Apache Tomcat v8.0 Tomcat installation directory: /home/$USER/Development/Tomcat_local JRE: java-8-openjdk-amd64
Make sure apache allows to request data from different web servers (CORS) => enable "Cross-Origin Resource Sharing" in the server-side applications.
Edit the WEB-INF folder of the application: $ gedit /var/lib/tomcat8/webapps/$NAME_OF_WEBAPP/WEB-INF/web.xml
References: http://enable-cors.org/server_tomcat.html https://tomcat.apache.org/tomcat-7.0-doc/config/filter.html#CORS_Filter https://awesometoast.com/cors/
credits: http://docs.geoserver.org/stable/en/user/installation/war.html
Make sure tomcat8 and its user are properly installed Download the latest version of GeoServer as a WAR: http://geoserver.org/download/
Extract the archive, move the geosrver.war file into the local tomcat webapp folder and start the local tomcat server $ /home/$USER/Development/Tomcat_local/bin/startup.sh
Visit http://localhost:10080/geoserver/web/ and be happy :)
For setting up the TDS see install instructions on the Unidata website. Create a setenv.sh (setenv.bat on windows) in the binary folder of the local application server: $ cd home/$USER/Development/Tomcat_local/bin $ touch setenv.sh
Set up the TDS content folder as described here: http://www.unidata.ucar.edu/software/thredds/current/tds/tutorial/GettingStarted.html
The datasets served by the TDS are defined in the catalog.xml file which can be found in the setup folder of this project. It references pairs of local temperature and precipitation datasets. New datasets have to be added in the same kind of structure. This file has to be in the TDS content folder /home/$USER/Development/TDS/content/thredds
Copy the files 'catalog.xml' and 'threddsConfig.xml' in there: $ cp /home/$USER/Development/climatecharts_setup/tds_setup/catalog.xml /home/$USER/Development/TDS/content/thredds $ cp /home/$USER/Development/climatecharts_setup/tds_setup/threddsConfig.xml /home/$USER/Development/TDS/content/thredds
The path to the local data directory can be changed in the <datasetRoot> element of the 'threddsConfig.xml'. For more information about thredds catalogs see: http://www.unidata.ucar.edu/software/thredds/current/tds/tutorial/CatalogPrimer.html
If the application and the TDS should be started from within Eclipse IDE, read the tutorial which can be also found in the setups folder.
Finally open your browser and test the application (http://localhost/climatecharts).
Connect Thredds Data Server with Local Data Files /src/main/resources/config.ini -> set path to local files
For debugging -- Find Tomcat logs here: /home/$USER/Development/TDS/content/thredds/logs
The ClimateCharts project is lincensed under the Apache License 2.0.
The website uses a collection of Javascript libraries:
- Bootstrap 3.3.7, http://getbootstrap.com/ - MIT license
- D3.js, https://d3js.org/ - BSD license
- D3 Boxplot with Axes and Labels, http://bl.ocks.org/jensgrubert/7789216 - no license
- Font Awesome 5.15.4, https://fontawesome.com - Font Awesome Free
- Glyphicon, https://www.glyphicons.com/ - CC BY 3.0
- jQuery 3.5.1, https://jquery.com/ - MIT license
- jQuery UI 1.12.1, https://jqueryui.com/ - CC0 1.0 Universal
- jQuery Plugin: waitMe, https://github.com/vadimsva/waitMe - MIT license
- Leaflet 1.0.3, https://leafletjs.com/ - BSD license
- Save SVG As PNG, https://github.com/exupero/saveSvgAsPng - MIT license
- Turf, https://turfjs.org/" - MIT license
- x2js, https://github.com/abdmob/x2js - no license