idea Improvements to time support for WMSLayers in ArcGIS JavaScript Maps SDK Ideas

Improvements to time support for WMSLayers

snlasystem — Wed, 14 Apr 2021 11:46:21 GMT

Dear all,

Version 4.17 introduced Time support for WMSLayers which is very welcomed. There are, however, a few quirks, at least for our use case.

Our application utilizes multiple meteorological layers from multiple WMS-servers. The layers have different TimeDimensions (both start/end and intervals) and user is able to mix and match these as he deems fit. The user is also thereafter able to replay the data via a TimeSlider, and view the Time dimensions for the different layers.

The above is what we are trying to replicate in ArcGIS. It shows the data from 4 layers from three different servers. The layers all have different start/end times (visualized by the colored bars) and different intervals (the number inside the parentheses and the vertical lines across the colored bars)

The ArcGIS WMSLayer docs state that "The timeInfo property is automatically set at layer initialization if the layer has one or more time dimensions." This is true to some extent, no pun intended, however, there's room for improvement.

WMSLayer.timeInfo.fullTimeExtent{start|end} seem to currently be set to the min/max values of ALL the layers available on the provided WMS server, regardless of the fact that only a few layers are selected in WMSLayer.sublayers. This becomes problematic for WMS servers with hundreds of layers available of which one only wants to use a few (whose time dimensions are subsets of the servers min/max).

Furthermore WMSLayer.timeInfo.interval doesn't seem to be set at all, even though the information is present in getCapabilities.

Here's a code-pen describing my problems with the API.

Best Regards,

Emil Aura

Re: Improvements to time support for WMSLayers

AnneFitz — Thu, 22 Apr 2021 20:32:32 GMT

Hi @snlasystem - thank you so much for your feedback! We plan to work on some improvements in the 4.20 release that will allow you to access the individual dimensions on the WMSLayer. I will keep you updated on this effort. Thanks again!

Re: Improvements to time support for WMSLayers

JYI — Wed, 10 Nov 2021 19:54:52 GMT

Hi Anne,

Is it possible to make this work? https://pavics.ouranos.ca/twitcher/ows/proxy/thredds/wms/birdhouse/cccs_portal/indices/Final/ANUSPLIN_v1/tn_max/YS/nrcan_canada_1950-2013_tn_max_YS.nc?SERVICE=WMS&REQUEST=GetMap&FORMAT=image/png&TRANSPARENT=TRUE&STYLES=&VERSION=1.3.0&LAYERS=tn_max&WIDTH=1119&HEIGHT=586&CRS=EPSG:3857&BBOX=-20037508.342788905,5315560.336420793,1847273.8962958835,16782337.571646746&Timeextent=1950-01-01T00:00:00.000Z/2013-01-01T00:00:00.000Z

I cannot use Javascript to load this to a simple web app. However, I am able to get this from ipyleaflet easily:

The WMS layer can be added to a web map from enterprise Portal too. Are there any tricks in order to make it work using the latest JavaScript API?

Here is the code pen.

Thanks.

Re: Improvements to time support for WMSLayers

AnneFitz — Wed, 10 Nov 2021 16:41:30 GMT

At 4.20 we added support for `dimensions` - allowing users to access the time dimensions for their WMSLayer. Here's the documentation: https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-WMSLayer.html#dimensions

And here's a codepen example: https://codepen.io/annefitz/pen/gOmEZjz?editors=1000

Re: Improvements to time support for WMSLayers

JYI — Thu, 11 Nov 2021 15:01:44 GMT

@AnneFitz

Just for displaying the WMS layer, This one works: Leaflet code pen

ArcGIS JavaScript API one does not work: ArcGIS JS codepen

Re: Improvements to time support for WMSLayers

JYI — Thu, 25 Nov 2021 02:00:21 GMT

Finally, I got this work, using ArcGIS JavaScript API 4.21. Just to share the experience, here is the picture:

the code (put the code under your web server, say, C:\inetpub\wwwroot\wms)

<html> <head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>TimeSlider widget | Sample | ArcGIS API for JavaScript 4.21</title> <link rel="stylesheet" href="https://js.arcgis.com/4.21/esri/themes/light/main.css" /> <script src="https://js.arcgis.com/4.21/"></script> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } #timeSlider { position: absolute; left: 5%; right: 5%; bottom: 20px; } </style> <script> require([ "esri/Map", "esri/views/MapView", "esri/layers/WMSLayer", "esri/widgets/TimeSlider", "esri/core/urlUtils" ], function (Map, MapView, WMSLayer, TimeSlider, urlUtils) { urlUtils.addProxyRule({ urlPrefix: "https://pavics.ouranos.ca", proxyUrl: "../proxy/proxy.ashx" }); const map = new Map({ basemap: "hybrid" }); const view = new MapView({ map, container: "viewDiv" }); const layer = new WMSLayer({ url: "https://pavics.ouranos.ca/twitcher/ows/proxy/thredds/wms/birdhouse/cccs_portal/indices/Final/ANUSPLIN_v1/rx1day/YS/nrcan_canada_1950-2013_rx1day_YS.nc" }); layer.load().then(function(lyr){ const precipitation = layer.allSublayers.find((l) => l.name === "rx1day"); layer.sublayers = [precipitation]; map.add(layer); const { dimensions } = precipitation; const timeDimension = dimensions.find((d) => d.name === "time"); const dates = timeDimension.extent; const start = dates[1]; const end = dates[63]; const timeSlider = new TimeSlider({ container: "timeSlider", view, mode: "instant", timeVisible: true, loop: true, fullTimeExtent: { start, end }, stops: { interval: { value: 1, unit: "years" } } }); }); }); </script> </head> <body> <div id="viewDiv"></div> <div id="timeSlider"></div> </body> </html>

The tricks are the following:

1. Add proxy: copy the contents inside the DotNet folder to your web server, say, C:\inetpub\wwwroot\proxy. This is required as the WMS layer server does not support CORS.

2. Make changes to the proxy.ashx file: In the copyRequestHeaders method, add case "origin":

I.e., make sure "the proxy does not send the Origin". This is the key. Thanks to @AnneFitz for it.

Re: Improvements to time support for WMSLayers - Status changed to: Implemented

BjornSvensson — Wed, 31 Aug 2022 18:30:58 GMT

This was implemented at version 4.20 (July 2021)