geotiffjs / geotiff.js

geotiff.js is a small library to parse TIFF files for visualization or analysis. It is written in pure JavaScript, and is usable in both the browser and node.js applications.
https://geotiffjs.github.io/
MIT License
845 stars 175 forks source link

Writing tiffs with alpha channel #385

Closed timhj closed 1 month ago

timhj commented 11 months ago

Using writeArrayBuffer to write a GeoTIFF from a canvas object with a transparent background results in the the alpha channel being replaced with white in the resulting TIFF.

The SamplesPerPixel is set to 4 in the metadata to specify RGBA but the alpha channel is missing in the resulting tiff. I imagine this is because writing transparency is not supported by geotiff.js.

If that's the case is it possible to add in support for alpha channel writing?

DanielJDufour commented 11 months ago

Hi, @timhj . That's an excellent question. geotiffwriter.js is still in beta, so there are definitely things that are missing. Could you try to add ExtraSamples: 1 or ExtraSamples: 2 to the metadata you are passing in to the writer and see if that fixes it?

DanielJDufour commented 11 months ago

Technically speaking if you need a quick workaround you could also define a no-data value and use that like transparency. Most applications won't display those values, but it's a far from perfect workaround.

And here's a few more notes in case you are curious:

References:

Technically speaking there's another way to add transparency information to a geotiff, but that's not supported either. That involves creating a separate transparency mask image. However, that would involve adding support to geotiffwriter for writing multiple images for one geotiff file and that is not currently supported either.

@daumann currently has a promising PR out adding more bit-depth options when writing: https://github.com/geotiffjs/geotiff.js/pull/366

Things are looking up! Seems like there's a lot of momentum around geotiff writing at the moment! :-)

timhj commented 11 months ago

@DanielJDufour - Extra Samples: 1 makes no difference but interestingly ExtraSamples: 2 makes semi-transparency work, you can see underlying map through the edges of heatmap elements in this screengrab:

Screenshot 2023-08-18 at 7 10 32 am

As soon as the image data gets to full transparency [0,0,0,0] the pixels are treated as white by QGIS. While it's possible to mask out the white in GIS software, it would be better if the transparency was automatically recognised.

Is it the WriteArrayBuffer in GeoTIFF.js that's flattening/transposing no data pixels to white and dropping the alpha channel?

DanielJDufour commented 11 months ago

writeArrayBuffer shouldn't be changing any values, but there always could be a bug.

Would you be able to write a test or provide the code you are using? I think it'll make the debugging process easier.

timhj commented 1 month ago

@DanielJDufour - This was resolved without any issue in the library. Setting an incorrect PhotometricInterpretation value for metadata was the cause of the issue.