Menu
  • Hem
  • Dokument
  • Om Mig
Geosupportsystem

Egen server för geodatatjänster – Del 6

Posted on 2014-01-20

I detta inlägg så skall det handla om att skapa egna webbapplikationer, i stället för att förlita sig på GeoExplorer. Så om man valt att inte installera OpenGeo Suite, utan nöjt sig med QGIS Server med data i PostGIS, så är det här man skall börja för att skapa sina webbkartor och tjänster.

För att bygga applikationer så kan man använda skriptspråk som antingen körs på servern (som PHP) eller på klienten (JavaSkript – JS). Det vanligaste i kartappar är någon form av JavaSkript, där OpenLayers berörts tidigare i samband med GeoExplorer.

Om man använder Tomcat som webbserver (port 8080, installeras med OpenGeo Suite) så är startsökvägen på servern /var/lib/tomcat6/webapps/ROOT. Där kan nya kataloger skapas med webbsidor och javascript.

Om man i stället vill använda Apache (port 80, installeras med QGIS Server) så är sökvägen på servern /var/www/. I mina exempel så kommer jag att använda Apache, men om du vill ha Tomcat så går det också fast du får anpassa sökvägarna lite.

Det kan vara en bättre idé att ha en separat webbserver för att sprida trafiken, men även för att det kan vara fler andra typer av tjänster man vill publicera på en webbserver som också behöver installeras och skötas. Men för att testa sina webbkartor så fungerar någon av dessa utmärkt.

Ett sätt att ordna detta enkelt är att skapa en ny delad katalog på servern på samma sätt som tidigare.

mkdir /var/www/webbkartor
chmod 777 /var/www/webbkartor/
vim /etc/samba/smb.conf

Redigera filen på samma sätt som för de övriga delade resurserna:

[webbkartor]
path = /var/www/webbkartor
browsable = yes
writable = yes
guest ok = yes
read only = no

Starta om Samba med service smbd restart.

Nu går det att skapa webbsidor med kartor bäst man vill i denna delade katalog och testa gör man på adressen:

http://192.168.1.42/webbkartor/filnamn.htm

Naturligtvis anpassat till serverns IP-adress. Vill man använda lokala javaskript och stilmallar så rekommenderas det att skapa underkataloger som ”script” och ”styles”. Kanske även ”images” och ”data” kan vara lämpliga kataloger att använda, så att startkatalogen blir så ren som möjligt.

Open Layers 3

Tänker man bygga sin app på OpenLayers så kan man göra det genom att hämta JavaSkript-biblioteket till den lokala servern, eller använda ett bibliotek online. Vill man hämta betaversionen av OpenLayer3 så gör man det på följande adress:

https://github.com/openlayers/ol3/releases/download/v3.0.0-beta.1/OpenLayers-v3.0.0-beta.1.zip

Beroende på när du läser detta så kan det vara läge att kontrollera om det finns en senare version av OpenLayer3 tillgängligt.

Packa upp i en skriptkatalog i den utdelade katalogen. De filer som behövs är de som finns i ”build” katalogen.

Vill man testa att det fungerar med OpenLayer3 så kan man skapa ett htm-dokument med nedanstående text.

<!doctype html>
<html lang="se">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="http://ol3js.org/en/master/build/ol.css" type="text/css">
<style>
   .map {
   height: 400px;
   width: 100%;
   }
</style>
<script src="http://ol3js.org/en/master/build/ol.js" type="text/javascript"></script>
<title>OpenLayers 3 Exempel</title>
</head>
<body>
<h2>Min Karta</h2>
<div id="map" class="map"></div>
<script type="text/javascript">
var map = new ol.Map({
   target: 'map',
   layers: [
      new ol.layer.Tile({
         source: new ol.source.MapQuestOpenAerial()
         })
      ],
   view: new ol.View2D({
      center: ol.proj.transform([37.41, 8.82], 'EPSG:4326', 'EPSG:3857'),
      zoom: 4
      })
   });
</script>
</body>
</html>

För att testa med eget javaskript så ändras sökvägen till ”ol.js” och ”ol.css” så att de pekar på den egna javaskriptkatalogen, med relativ sökväg. Exempelvis:

”script/ol.js”

Leaflet

På samma sätt som ovan kan man välja att använda Leaflet.js, eller något annat javaskript för webbkartor för den delen.

Leaflet är byggt för att vara så litet som möjligt och saknar därför en del funktioner som finns i OpenLayers. Däremot så finns det massor med tilläggsskript för Leaflet, så de funktioner som man saknar kan gå att tillföra ganska enkelt, men man slipper dras med ett onödigt stort javaskriptbibliotek. Leaflet hämtas från adressen nedan och packas upp till den tidigare skapade katalogen ”script”.

http://leaflet-cdn.s3.amazonaws.com/build/leaflet-0.7.1.zip

Även här kan det vara läge att kontrollera att man laddar hem den senaste versionen.

För att testa leaflet kan ett annat exempel användas. Skapa filen leaflet.htm i katalogen ”webbkartor” och skriv in följande.

<!DOCTYPE html>
<html>
<head>
<title>Leaflet Layers Control Example</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="script/leaflet.css" />
</head>
<body>
<div id="map" style="width: 100%; height: 450px"></div> 
<script src="script/leaflet.js"></script>
<script>
var cities = new L.LayerGroup();
var cmAttr = 'Map data &copy; 2011 OpenStreetMap contributors, Imagery &copy; 2011 CloudMade',
   cmUrl = 'http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/{styleId}/256/{z}/{x}/{y}.png'; 
var minimal = L.tileLayer(cmUrl, {styleId: 22677, attribution: cmAttr}),
   midnight = L.tileLayer(cmUrl, {styleId: 999, attribution: cmAttr}),
   motorways = L.tileLayer(cmUrl, {styleId: 46561, attribution: cmAttr}); 
var map = L.map('map', {
   center: [39.73, -104.99],
   zoom: 10,
   layers: [minimal, motorways, cities]
   }); 
var baseLayers = {
   "Minimal": minimal,
   "Night View": midnight
   }; 
var overlays = {
   "Motorways": motorways,
   "Cities": cities
   }; 
L.control.layers(baseLayers, overlays).addTo(map);
</script>
</body>
</html>

Med ovanstående enkla exempel så går det att ”känna” lite på Leaflet och OpenLayers, men det kanske inte är tillräckligt för attt bestämma sig. Det finns massor med exempel på Internet och man kan bygga applikationer med det script man fastnar mest för.

I nästa inlägg så blir det mera detaljer och exempel med Leaflet som grund.

Lämna ett svar Avbryt svar

Din e-postadress kommer inte publiceras. Obligatoriska fält är märkta *

Translate with Google

GBR In English
GER Auf Deutch
FRA En Français
ESP En Español
Swedish is a hard language for a machine to translate. Nuance and detail will likely be lost.
     

Bok om QGIS på Svenska

Bok

Beställ Boken/E-bok genom att klicka på bilden (även förhandsgranskning).

Senaste kommentarer

  • klakar om Laga hål i höjddata
  • Per Ekström om Laga hål i höjddata
  • Sur om Mera verktyg i QGIS
  • Anton om ”Mobile *.Geodatabase”
  • Fredrik Ekberg om Ingen är oskyldig

Arkiv

Prenumerera på Geosupportsystem

Skriv in namn och epost för att prenumerera på meddelanden från denna blogg.
Loading

geosupport

TrueNAS bygge. @fractaldesignna Define R5 är rikt TrueNAS bygge. @fractaldesignna Define R5 är riktigt trevlig att bygga i, och den sväljer väldigt mycket disk. Här skall virtualiseras både PostGis, WebODM och Geonode så småningom.
Då har jag lite att bläddra i ett tag framöver. Då har jag lite att bläddra i ett tag framöver.
YouTube video to frames. Processed in OpenDroneMap YouTube video to frames. Processed in OpenDroneMap and visualized in QGIS 3.17.
Ladda mer...

Meta

  • Logga in
  • Flöde för inlägg
  • Flöde för kommentarer
  • WordPress.org
©2021 Geosupportsystem | WordPress Theme by Superbthemes.com