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?
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!