Fix for 3D Blending.

[ilan-gold]

Background

Previously our blending didn't work because we were not using the right WebGL settings. It should work pretty well now.

To test this out (or the previous non-functioning way of doing things), you can add another VolumeLayer to the VolumeView, but offset a bit:

  getLayers({ props }) {
    const { loader } = props;
    const { id } = this;

    const layers = [
      new VolumeLayer(props, {
        id: `${loader.type}${getVivId(id)}`
      }),
      new VolumeLayer(props, {
        id: `${loader.type}${getVivId(id)}-2`,
        modelMatrix: new Matrix4().rotateZ(.5).translate([250, 250, 0])
      })
    ];

    return layers;
  }

There are other things that we can do like depth testing and so forth to get different blending effects (besides this one) but those would require a change along the lines of this - in short, we would need to render each channel in its own individual layer and then combine them (similar to how we do for multi-modal data) so that we can track the depth at which each channel renders, which we currently cannot do (you only get one gl_FragDepth per fragment shader pass). The downside of this alternative approach is that the additive rendering mode does not look as nice from my testing and it would mean that we could not use global colormaps (i.e one colormap for many channels). FWIW I really like ours at the moment - the difference is that the opacity is per channel in this other approach whereas now it is global to all channels so it ends up looking more like maximum intensity projection in the alternative approach. This other option is more broadly related to #304 (comment) and if we do go that route, I think we should do it for our 2D layers as well. One reason to do depth testing is that it would allow us to overlay polygons/scale axis - without that information, WebGL does not know what goes in front vs back.

Here is what the alternative option would make our additive rendering mode look like (very similar to MIP):

Change List

• Add correct blending parameters to the VolumeLayer

Checklist

• Update JSdoc types if there is any API change.
• Make sure Avivator works as expected with your change.