Select to view content in your preferred language

Showing a FlowRenderer for a COG image

189
1
02-13-2026 02:11 AM
JonathanDawe_BAS
Frequent Contributor

I’ve been experimenting with ImageryTileLayer + COG data in the JavaScript Maps SDK in order to hopefully encode and show flow.  My COG here (derived from NOAA GFS WAVE data): https://jonnydawe.github.io/.well-known/wave_uv_cog.tif encodes U/V components (Band 1 = U, Band 2 = V). The data itself works fine, but out of the box it is not possible to get a flow renderer to work without some tweaks.

The issue is highlighed in the flowRenderer docs: "the source type of your raster dataset must be Vector-UV or Vector-MagDir" I notice that my COG is treated as generic data type, not vector-uv, so the renderer does not work....

However... I notice that I can just override the datatype by setting its keyProperties (albeit on an internal private property...)

imageryLayer.load().then(() => {
  const rasterInfo = imageryLayer.raster.rasterInfo;
  const existingKeyProperties = rasterInfo.keyProperties ?? {};

  rasterInfo.keyProperties = {
    ...existingKeyProperties,
    DataType: "Vector-UV",
  };

  console.log("RasterInfo dataType:", rasterInfo.dataType);
});

 

The end result is a flow renderer working with a COG: https://codepen.io/Jonathan-Dawe/pen/myEoboQ?editors=1000 

Is there a way to get the layer to internally identify the COG as a Vector-UV layer without having to override the internal property like this? 

 

 

0 Kudos
1 Reply
JonathanDawe_BAS
Frequent Contributor

I've discovered that if I set it in the metadata of the COG, "DataType": "Vector-UV", then it it also works! However I still get an error about it not matching the required type because I have more than two bands! 

0 Kudos