trying to set up #uicontrol as default

I am trying to transition NeuroData’s color and min/max ui controls to use the new #uicontrol which seems better and easier to make compatible with the different neuroglancer deployments around.

The problem I am having is that it seems as though the variables defined inside the #uicontrol don’t aren’t initialized in time for the shader, so the shader errors out with a bunch of “undeclared identifier” messages. Once you edit the shader, everything starts to work again.

Here’s what I have:

I put the following shader as a default inside src/neuroglancer/sliceview/volume/image_renderlayer.ts:

#uicontrol vec3 color color(default="white")
#uicontrol float min slider(default=0, min=0, max=1, step=0.01)
#uicontrol float max slider(default=1, min=0, max=1, step=0.01)
#uicontrol float brightness slider(default=0, min=-1, max=1, step=0.1)
#uicontrol float contrast slider(default=0, min=-3, max=3, step=0.1)

float scale(float x, float min, float max) {
  return (x - min) / (max - min);
}

void main() {
  emitRGB(
    color * vec3(
      scale(toNormalized(getDataValue()), min, max) + brightness,
      scale(toNormalized(getDataValue()), min, max) + brightness,
      scale(toNormalized(getDataValue()), min, max) + brightness
    ) * exp(contrast)
  );
}

I also have a little bit of logic in src/neuroglancer/image_user_layer.ts order to make old ndviz links compatible with the new system (automatically pulling in min/max/color and putting them into the shader_controls).

The branch is located here: https://github.com/neurodata/neuroglancer/tree/ben/preserve-color-state-uicontrol

I’ve been struggling for a bit, and wondering if the #uicontrol are really only meant to be something to be interacted with after a channel is loaded or whether a customized default #uicontrol makes sense.

Thanks!

[jbms]

Yes, this is exactly the sort of thing I intended to be possible — and was considering making something like this the default shader in neuroglancer upstream. I noticed some bugs in the handling of the shader UI controls by image_renderlayer.ts previously while working on the ndims branch and had fixed the issues there. I just cherry picked those changes over to the master branch, which resolves this particular issue.

On the topic of min/max values, however, I was actually thinking of going in the opposite direction and adding special support to the image layer for min/max values like neurodata already does: specifically integrating the min/max controls into a histogram of the data values in the currently visible chunks — particularly for 16-bit and float data I imagine a histogram will be very useful for picking reasonable min/max values. However, I suppose the histogram+range selection could just be available as a shader control as well.

Even if the histogram-based selection is available as a shader control, it might still be sense though to also have a built-in min/max control that either affects toNormalized, or affects e.g. a new getNormalizedDataValue function.

Note: for your shader, you can just multiply the color by a float, no need to repeat the scale expression 3 times.

[chrisroat]

We have been using precomputed cloudvolumes, and store image statistics (i.e. histogram of values per channel) alongside the volume. We have a library to assemble neuroglancer links, which uses the statistics to create the shader code with 2 per-channel controls: a min slider and a max slider. An example is below.

I’ll check out the invlerp UI control!

#uicontrol vec3 color0 color(default="red")
#uicontrol float minimum0 slider(default=110, min=24, max=6082, step=1)
#uicontrol float maximum0 slider(default=179, min=24, max=6082, step=1)
#uicontrol vec3 color1 color(default="green")
#uicontrol float minimum1 slider(default=123, min=0, max=2905, step=1)
#uicontrol float maximum1 slider(default=250, min=0, max=2905, step=1)
#uicontrol vec3 color2 color(default="blue")
#uicontrol float minimum2 slider(default=99, min=0, max=25495, step=1)
#uicontrol float maximum2 slider(default=1900, min=0, max=25495, step=1)
#uicontrol vec3 color3 color(default="yellow")
#uicontrol float minimum3 slider(default=178, min=0, max=5529, step=1)
#uicontrol float maximum3 slider(default=220, min=0, max=5529, step=1)
#uicontrol vec3 color4 color(default="cyan")
#uicontrol float minimum4 slider(default=134, min=0, max=3672, step=1)
#uicontrol float maximum4 slider(default=250, min=0, max=3672, step=1)

void main() {
  vec3 zeros = vec3(0., 0., 0.);
  float norm0 = (float(getDataValue(0).value) - minimum0) / float(maximum0 - minimum0);
  vec3 val0 = color0 * norm0;
  val0 = max(val0, zeros);
  float norm1 = (float(getDataValue(1).value) - minimum1) / float(maximum1 - minimum1);
  vec3 val1 = color1 * norm1;
  val1 = max(val1, zeros);
  float norm2 = (float(getDataValue(2).value) - minimum2) / float(maximum2 - minimum2);
  vec3 val2 = color2 * norm2;
  val2 = max(val2, zeros);
  float norm3 = (float(getDataValue(3).value) - minimum3) / float(maximum3 - minimum3);
  vec3 val3 = color3 * norm3;
  val3 = max(val3, zeros);
  float norm4 = (float(getDataValue(4).value) - minimum4) / float(maximum4 - minimum4);
  vec3 val4 = color4 * norm4;
  val4 = max(val4, zeros);

  emitRGB(val0 + val1 + val2 + val3 + val4);
}