0

I've been investigating setting up a server with OpenLayers which will display tiled data from a datacube-ows wms server. At the moment I have an index.html file which initializes the server and a wms.js javascript file which sets up the map I'd like to display.

It doesn't display any errors currently, but when I go to localhost:1234, there is an empty white page with no data on it.

I'm pretty new to wms, openlayers and web visualisation in general so I imagine there is probably something relatively simple I'm missing, but I haven't been able to find any answers from Googling so far. I reworked the wms.js file in the style of GeoServer WMS layer won't load on OpenLayers 5 but it had no effect.

index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Test Map</title>
    <style>
      #map {
        width: 400px;
        height: 250px;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script src="./wms.js"></script>
  </body>
</html>  

wms.js:

import Map from 'ol/Map.js';
import View from 'ol/View.js';
import TileLayer from 'ol/layer/Tile.js';
import OSM from 'ol/source/OSM.js';
import TileWMS from 'ol/source/TileWMS.js';

var layers = [
  new TileLayer({
    source: new OSM()
  }),
  new TileLayer({
    source: new TileWMS({
      url: 'http://localhost/datacube_wms',
      params: {'LAYERS': '10DayIndices:ndvi', 'TILED': true},
      serverType: 'datacube_wms',
      projection: 'EPSG:4326'
    })
  })
];

var view = new View({
  projection: 'EPSG:4326',
  center: [48.031532, 102.376126],
  zoom: 2
});

var map = new Map({
  target: 'map',
  layer: layers,
  view: view
});

The WMS does work and below is an example of a successful GetMap request;

http://localhost:5000/?service=WMS
&request=GetMap
&version=1.3.0
&layers=10DayIndices
&styles=ndvi
&crs=EPSG:32648
&bbox=399600,5299260,499560,5399220
&width=4998
&height=4998
&format=image/png
  • Putting aside the JS, does the WMS actually work? Do you get a response to a GetCapabilities request typed into your browser? like: localhost:1234/… – nmtoken Aug 7 at 11:13
  • The WMS works (it broadcasts to localhost:3001/ I believe, is the port number important here?). I've managed to get valid responses to GetCapabilities & GetFeatureInfo and also have plotted an image using a GetMap request. – JackLidge Aug 7 at 11:30
  • I don't think it is the cause of the problem, but your serverType option is invalid, OpenLayers expects it to be one the the listed types, or undefined openlayers.org/en/v4.6.5/apidoc/ol.source.html#.WMSServerType (using version 4 as the link in the OL5 API doesn't work) – Mike Aug 7 at 11:54
  • ahh right, will remove that line then. I hadn't seen any examples without one (all the examples I'd seen had 'geoserver' there so just assumed it was a required parameter). – JackLidge Aug 7 at 11:58
  • is the port number important here not really (some clients expect standard ports, but for internal testing not) , but your code line url: 'http://localhost/datacube_wms', doesn't include a port number (so port 80 is expected) and if your service is on port 3001 then that's a problem. – nmtoken Aug 7 at 12:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.