Can we have a colormap with varying transparency?

[j08lue]

We would like to try out whether we can render a dataset from transparent to fully visible with TiTiler.

TiTiler does not provide a shortcut for that (see Rendering docs), but it might be possible with a custom colormap that has entries like

0: (255, 255, 255, 0)
1: (255, 255, 255, 1)
2: (255, 255, 255, 2)
3: (255, 255, 255, 3)
...
255: (255, 255, 255, 255)

(example increasing from transparent at 0 to fully black at 255)

But this is probably only realistic for integer data with a small enough data range. Data could be transformed to that range.

The goal of this ticket is to try this out.

Acceptance criteria

• [ ] Tried out scaling transparency with data ranging from 0 to 255 or a smaller number of steps.

[j08lue]

@Jeanne-le-Roux, can you tell what dataset you had in mind and perhaps provide a sample GeoTIFF file for it? Else we can try first with some other data.

[Jeanne-le-Roux]

This is being requested for the TM5-4DVar Isotopic CH4 Inverse Fluxes dataset. @siddharth0248 or @SwordSaintLancelot can you point Jonas to this dataset if the ingest is complete? Here are the source files (NetCDF): https://gmao.gsfc.nasa.gov/gmaoftp/sourish/IDS/for_distribution/GHG-IAC/

[j08lue]

Snippet copied from the TiTiler docs:

import requests

response = requests.get(
    f"titiler.xyz/cog/preview",
    params={
        "url": "<YOUR COG HERE>",
        "bidx": "1",
        "colormap": {
                "0": [255, 255, 255, 0],
                "1": [255, 255, 255, 1],
                "3": [255, 255, 255, 3],
                "4": [255, 255, 255, 4],
        }
    }
)

[j08lue]

Turns out someone had just asked that question in the TiTiler discussions: https://github.com/developmentseed/titiler/discussions/496#discussioncomment-6715321

So the answer here is that scaling transparency is currently not possible.

[j08lue]

Update: TiTiler will get this feature back. It will probably take a little while for this to get implemented and then deployed to the VEDA stack, so we should choose a different rendering for GHG R1, @Jeanne-le-Roux.

[Jeanne-le-Roux]

Thanks for looking into this! I'll let the provider know to look for an alternative for R1, but that we're working to support the feature.

[Jeanne-le-Roux]

As a side note here's the code snippet that was shared with me for ramped transparency w/ matplotlib:

    from matplotlib import colors
    import numpy as np

    def add_transparency(input_colormap, side='left', **kwargs):
        # side can be 'left', 'right', or 'center', specifying where in the colormap alpha should go to zero
        # If side is 'center', an additional argument can be specified, zero_pt, that speficies the value in
        # (0,1) at which alpha should be zero. If this is not specified, zero_pt=0.5 is assumed.
        # additional kwargs include:
        #   num_segments, defaults to input_colormap.N
        #   alpha_ramp, defaults to 10 (higher means more abrupt transition to transparent)
        N = kwargs['num_segments'] if 'num_segments' in kwargs else input_colormap.N
        alpha = kwargs['alpha_ramp'] if 'alpha_ramp' in kwargs else 10.0
        if side.lower() in ['center', 'c']:
            zero_pt = kwargs['zero_pt'] if 'zero_pt' in kwargs else 0.5

        if side.lower() in ['center', 'c']:
            x = np.zeros(2*N-1, dtype=np.float64)
            dx = zero_pt/(N-1)
            x[:N-1] = np.arange(0.,zero_pt,dx)
            x[N-1:] = np.linspace(zero_pt,1.,N)
        else:
            x = np.linspace(0.,1.,N)
        color_list = input_colormap(x)

        if side.lower() in ['l', 'left']:
            alpha_ramp = (np.tanh(alpha*x))**2
        elif side.lower() in ['r', 'right']:
            alpha_ramp = (np.tanh(alpha*(1-x)))**2
        elif side.lower() in ['c', 'center']:
            alpha_ramp = (np.tanh(alpha*(x-zero_pt)))**2

        color_list[:,-1] = alpha_ramp
        output_colormap = colors.ListedColormap(color_list)

        return output_colormap

[moradology]

Looks like the most recent release of titiler is now out and ought to enable semi-transparency in colormaps: https://github.com/developmentseed/titiler/releases/tag/0.14.0 https://github.com/developmentseed/titiler/blob/main/CHANGES.md

[moradology]

OK, so it appears as though TiTiler can now support this but we might be temporarily blocked by titiler-pgstac as its upgrade is pending an upcoming pgstac release 🙃

[j08lue]

Thanks for the update and the heads-up about the blocking dependencies.

We will proceed with a workaround where we add an extra set of assets where the values to be transparent were masked. The current use case is that data below a threshold is transparent. I.e. not a gradient (more like a step function).

[j08lue]

Probably another case for a server-side implemented color map like we did with

• https://github.com/NASA-IMPACT/veda-config-ghg/issues/203#issuecomment-1800370794

[moradology]

Looks as though this was fixed in passing, as we bumped up titiler versions elsewhere: https://github.com/NASA-IMPACT/veda-backend/blob/develop/raster_api/runtime/setup.py#L11