@vitessce/gl 2.0.3-beta.0 → 3.0.0

package/src/SelectionExtension/shader-module.js

@@ -0,0 +1,22 @@
+const vs = `
+attribute float isSelected;
+`;
+
+const inject = {
+  'vs:DECKGL_FILTER_GL_POSITION': `
+    position.z += (1. - isSelected) * .00005; // Add a small z offset for unselected points in the positive direction i.e into the screen.
+  `,
+  'fs:#main-start': ` // Gets rid of bad border effects (active after deck.gl 8.5): https://github.com/visgl/deck.gl/pull/6081
+    float distToCenterNew = length(unitPosition) * outerRadiusPixels;
+    float inCircleNew = step(distToCenterNew, outerRadiusPixels);
+    if (inCircleNew == 0.0) {
+      discard;
+    }
+  `,
+};
+
+export default {
+  name: 'selection',
+  vs,
+  inject,
+};

package/src/SelectionLayer.js

@@ -0,0 +1,187 @@
+/* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable no-underscore-dangle */
+// File adopted from nebula.gl's SelectionLayer
+// https://github.com/uber/nebula.gl/blob/8e9c2ec8d7cf4ca7050909ed826eb847d5e2cd9c/modules/layers/src/layers/selection-layer.js
+import { CompositeLayer } from 'deck.gl';
+import { polygon as turfPolygon, point as turfPoint } from '@turf/helpers';
+import booleanWithin from '@turf/boolean-within';
+import booleanContains from '@turf/boolean-contains';
+import booleanOverlap from '@turf/boolean-overlap';
+import booleanPointInPolygon from '@turf/boolean-point-in-polygon';
+import { ScatterplotLayer } from '@deck.gl/layers';
+import { SELECTION_TYPE } from 'nebula.gl';
+import { EditableGeoJsonLayer } from '@nebula.gl/layers';
+import { DrawPolygonByDraggingMode, ViewMode } from '@nebula.gl/edit-modes';
+
+const EDIT_TYPE_ADD = 'addFeature';
+const EDIT_TYPE_CLEAR = 'clearFeatures';
+
+class ClickableDrawPolygonByDraggingMode extends DrawPolygonByDraggingMode {
+  // eslint-disable-next-line class-methods-use-this
+  handleClick(event, props) {
+    props.onEdit({ editType: EDIT_TYPE_CLEAR });
+  }
+}
+
+const MODE_MAP = {
+  [SELECTION_TYPE.POLYGON]: ClickableDrawPolygonByDraggingMode,
+};
+
+const defaultProps = {
+  layerIds: [],
+  onSelect: () => {},
+};
+
+const EMPTY_DATA = {
+  type: 'FeatureCollection',
+  features: [],
+};
+
+const LAYER_ID_GEOJSON = 'selection-geojson';
+
+const PASS_THROUGH_PROPS = [
+  'lineWidthScale',
+  'lineWidthMinPixels',
+  'lineWidthMaxPixels',
+  'lineWidthUnits',
+  'lineJointRounded',
+  'lineMiterLimit',
+  'pointRadiusScale',
+  'pointRadiusMinPixels',
+  'pointRadiusMaxPixels',
+  'lineDashJustified',
+  'getLineColor',
+  'getFillColor',
+  'getPointRadius',
+  'getLineWidth',
+  'getLineDashArray',
+  'getTentativeLineDashArray',
+  'getTentativeLineColor',
+  'getTentativeFillColor',
+  'getTentativeLineWidth',
+  'editHandlePointRadiusScale',
+  'editHandlePointRadiusMinPixels',
+  'editHandlePointRadiusMaxPixels',
+  'getEditHandlePointColor',
+  'getEditHandlePointRadius',
+  'modeHandlers',
+];
+
+export default class SelectionLayer extends CompositeLayer {
+  _selectPolygonObjects(coordinates) {
+    const {
+      onSelect,
+      getCellCoords,
+      cellsQuadTree,
+      flipY,
+    } = this.props;
+
+    const flippedCoordinates = (flipY
+      ? coordinates.map(poly => poly.map(p => ([p[0], -p[1]])))
+      : coordinates);
+
+    // Convert the selection to a turf polygon object.
+    const selectedPolygon = turfPolygon(flippedCoordinates);
+
+    // Create an array to store the results.
+    const pickingInfos = [];
+
+    // quadtree.visit() takes a callback that returns a boolean:
+    // If true returned, then the children of the node are _not_ visited.
+    // If false returned, then the children of the node are visited.
+    // Reference: https://github.com/d3/d3-quadtree#quadtree_visit
+    cellsQuadTree.visit((node, x0, y0, x1, y1) => {
+      const nodePoints = [[[x0, y0], [x1, y0], [x1, y1], [x0, y1], [x0, y0]]];
+      const nodePolygon = turfPolygon(nodePoints);
+
+      const nodePolygonContainsSelectedPolygon = booleanContains(nodePolygon, selectedPolygon);
+      const nodePolygonWithinSelectedPolygon = booleanWithin(nodePolygon, selectedPolygon);
+      const nodePolygonOverlapsSelectedPolgyon = booleanOverlap(nodePolygon, selectedPolygon);
+
+      if (!nodePolygonContainsSelectedPolygon
+        && !nodePolygonWithinSelectedPolygon
+        && !nodePolygonOverlapsSelectedPolgyon) {
+        // We are not interested in anything below this node,
+        // so return true because we are done with this node.
+        return true;
+      }
+
+      // This node made it past the above return statement, so it must either
+      // contain, be within, or overlap with the selected polygon.
+
+      // Check if this is a leaf node.
+      if (node.data
+        && booleanPointInPolygon(
+          turfPoint([].slice.call(getCellCoords(node.data))), selectedPolygon,
+        )
+      ) {
+        // This node has data, so it is a leaf node representing one data point,
+        // and we have verified that the point is in the selected polygon.
+        pickingInfos.push(node.data);
+      }
+
+      // Return false because we are not done.
+      // We want to visit the children of this node.
+      return false;
+    });
+
+    onSelect({ pickingInfos });
+  }
+
+  renderLayers() {
+    const { onSelect } = this.props;
+    const mode = MODE_MAP[this.props.selectionType] || ViewMode;
+
+    const inheritedProps = {};
+    PASS_THROUGH_PROPS.forEach((p) => {
+      if (this.props[p] !== undefined) inheritedProps[p] = this.props[p];
+    });
+    const layers = [
+      new EditableGeoJsonLayer(
+        this.getSubLayerProps({
+          id: LAYER_ID_GEOJSON,
+          pickable: true,
+          mode,
+          modeConfig: {
+            dragToDraw: true,
+          },
+          selectedFeatureIndexes: [],
+          data: EMPTY_DATA,
+          onEdit: ({ updatedData, editType }) => {
+            if (editType === EDIT_TYPE_ADD) {
+              const { coordinates } = updatedData.features[0].geometry;
+              this._selectPolygonObjects(coordinates);
+            } else if (editType === EDIT_TYPE_CLEAR) {
+              // We want to select an empty array to clear any previous selection.
+              onSelect({ pickingInfos: [] });
+            }
+          },
+          _subLayerProps: {
+            guides: {
+              pointType: 'circle',
+              _subLayerProps: {
+                'points-circle': {
+                  // Styling for editHandles goes here.
+                  // Reference: https://github.com/uber/nebula.gl/issues/618#issuecomment-898466319
+                  type: ScatterplotLayer,
+                  radiusScale: 1,
+                  stroked: true,
+                  getLineWidth: 1,
+                  radiusMinPixels: 1,
+                  radiusMaxPixels: 3,
+                  getPointRadius: 2,
+                },
+              },
+            },
+          },
+          ...inheritedProps,
+        }),
+      ),
+    ];
+
+    return layers;
+  }
+}
+
+SelectionLayer.layerName = 'SelectionLayer';
+SelectionLayer.defaultProps = defaultProps;

package/src/bitmask-layer-shaders.js

@@ -0,0 +1,92 @@
+import { colormaps } from './glsl/index.js';
+
+export const vs = `
+#define SHADER_NAME bitmask-layer-vertex-shader
+
+attribute vec2 texCoords;
+attribute vec3 positions;
+attribute vec3 positions64Low;
+attribute vec3 instancePickingColors;
+
+varying vec2 vTexCoord;
+
+void main(void) {
+  geometry.worldPosition = positions;
+  geometry.uv = texCoords;
+  geometry.pickingColor = instancePickingColors;
+  gl_Position = project_position_to_clipspace(positions, positions64Low, vec3(0.0), geometry.position);
+  DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
+  vTexCoord = texCoords;
+  vec4 color = vec4(0.0);
+  DECKGL_FILTER_COLOR(color, geometry);
+}
+`;
+
+export const fs = `
+#define SHADER_NAME bitmask-layer-fragment-shader
+precision highp float;
+
+${colormaps}
+
+// Data (mask) texture
+uniform sampler2D channel0;
+uniform sampler2D channel1;
+uniform sampler2D channel2;
+uniform sampler2D channel3;
+uniform sampler2D channel4;
+uniform sampler2D channel5;
+
+// Color texture
+uniform sampler2D colorTex;
+uniform float colorTexHeight;
+uniform float colorTexWidth;
+uniform float hovered;
+// range
+uniform bool channelsVisible[6];
+
+// Expression mapping
+uniform vec2 uColorScaleRange;
+uniform bool uIsExpressionMode;
+uniform sampler2D expressionTex;
+
+// opacity
+uniform float opacity;
+
+varying vec2 vTexCoord;
+
+vec4 sampleAndGetColor(sampler2D dataTex, vec2 coord, bool isOn){
+  float sampledData = texture(dataTex, coord).r;
+  vec4 hoveredColor = float(sampledData == hovered && sampledData > 0. && hovered > 0.) * vec4(0., 0., 1., 1.);
+  // Colors are laid out corresponding to ids in row-major order in the texture.  So if width of the texture is 10, and you want ID 25,
+  // you need coordinate (1, 4) (i.e 2 rows down, and 5 columns over indexed from 0 for a total of 25 units covered in row major order).
+  vec2 colorTexCoord = vec2(mod(sampledData, colorTexWidth) / colorTexWidth, floor(sampledData / colorTexWidth) / (colorTexHeight - 1.));
+  float expressionValue = texture(expressionTex, colorTexCoord).r / 255.;
+  float scaledExpressionValue = (expressionValue - uColorScaleRange[0]) / max(0.005, (uColorScaleRange[1] - uColorScaleRange[0]));
+  vec4 sampledColor = float(uIsExpressionMode) * COLORMAP_FUNC(clamp(scaledExpressionValue, 0.0, 1.0)) +  (1. - float(uIsExpressionMode)) * vec4(texture(colorTex, colorTexCoord).rgb, 1.);
+  // Only return a color if the data is non-zero.
+  return max(0., min(sampledData, 1.)) * float(isOn) * (sampledColor + hoveredColor);
+}
+
+void main() {
+
+  gl_FragColor = sampleAndGetColor(channel0, vTexCoord, channelsVisible[0]);
+
+  // If the sampled color and the currently stored color (gl_FragColor) are identical, don't blend and use the sampled color,
+  // otherwise just use the currently stored color.  Repeat this for all channels.
+  vec4 sampledColor = sampleAndGetColor(channel1, vTexCoord, channelsVisible[1]);
+  gl_FragColor = (sampledColor == gl_FragColor || sampledColor == vec4(0.)) ? gl_FragColor : sampledColor;
+  sampledColor = sampleAndGetColor(channel2, vTexCoord, channelsVisible[2]);
+  gl_FragColor = (sampledColor == gl_FragColor || sampledColor == vec4(0.)) ? gl_FragColor : sampledColor;
+  sampledColor = sampleAndGetColor(channel3, vTexCoord, channelsVisible[3]);
+  gl_FragColor = (sampledColor == gl_FragColor || sampledColor == vec4(0.)) ? gl_FragColor : sampledColor;
+  sampledColor = sampleAndGetColor(channel4, vTexCoord, channelsVisible[4]);
+  gl_FragColor = (sampledColor == gl_FragColor || sampledColor == vec4(0.)) ? gl_FragColor : sampledColor;
+  sampledColor = sampleAndGetColor(channel5, vTexCoord, channelsVisible[5]);
+  gl_FragColor = (sampledColor == gl_FragColor || sampledColor == vec4(0.)) ? gl_FragColor : sampledColor;
+  // Apply the opacity if there is pixel data, and if the pixel data is empty i.e no segmentation, use 0 opacity.
+  gl_FragColor = vec4(gl_FragColor.rgb, (gl_FragColor.rgb == vec3(0., 0., 0.)) ? 0.0 : opacity);
+
+  geometry.uv = vTexCoord;
+  DECKGL_FILTER_COLOR(gl_FragColor, geometry);
+}
+`;

package/src/constants.js

@@ -0,0 +1,13 @@
+// List of the GLSL colormaps available,
+// to validate against before string replacing.
+export const GLSL_COLORMAPS = [
+  'plasma',
+  'viridis',
+  'jet',
+];
+export const GLSL_COLORMAP_DEFAULT = 'plasma';
+export const COLORMAP_SHADER_PLACEHOLDER = 'COLORMAP_FUNC';
+
+export const DEFAULT_GL_OPTIONS = { webgl2: true };
+
+export { SELECTION_TYPE } from 'nebula.gl';

package/src/deck.js

@@ -0,0 +1,4 @@
+export { default as DeckGL } from 'deck.gl';
+export { COORDINATE_SYSTEM } from '@deck.gl/core';
+export { PolygonLayer, TextLayer, ScatterplotLayer } from '@deck.gl/layers';
+export { OrthographicView, OrbitView } from '@deck.gl/core';

package/src/glsl/README.md

@@ -0,0 +1,8 @@
+The `.out.glsl` files in this directory must be generated by running
+
+```sh
+pnpm run glslify
+```
+in the root of the package.
+
+Then, the outputs can be copied into JS files and exported.

package/src/glsl/colormaps.in.glsl

@@ -0,0 +1,15 @@
+#pragma glslify: plasma = require("glsl-colormap/plasma")
+#pragma glslify: viridis = require("glsl-colormap/viridis")
+#pragma glslify: greys = require("glsl-colormap/greys")
+#pragma glslify: magma = require("glsl-colormap/magma")
+#pragma glslify: jet = require("glsl-colormap/jet")
+#pragma glslify: bone = require("glsl-colormap/bone")
+#pragma glslify: copper = require("glsl-colormap/copper")
+#pragma glslify: density = require("glsl-colormap/density")
+#pragma glslify: inferno = require("glsl-colormap/inferno")
+#pragma glslify: cool = require("glsl-colormap/cool")
+#pragma glslify: hot = require("glsl-colormap/hot")
+#pragma glslify: spring = require("glsl-colormap/spring")
+#pragma glslify: summer = require("glsl-colormap/summer")
+#pragma glslify: autumn = require("glsl-colormap/autumn")
+#pragma glslify: winter = require("glsl-colormap/winter")

package/src/glsl/index.js

@@ -0,0 +1,341 @@
+
+export const colormaps = `#define GLSLIFY 1
+vec4 plasma (float x_4) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0.050980392156862744,0.03137254901960784,0.5294117647058824,1);
+  const float e1 = 0.13;
+  const vec4 v1 = vec4(0.29411764705882354,0.011764705882352941,0.6313725490196078,1);
+  const float e2 = 0.25;
+  const vec4 v2 = vec4(0.49019607843137253,0.011764705882352941,0.6588235294117647,1);
+  const float e3 = 0.38;
+  const vec4 v3 = vec4(0.6588235294117647,0.13333333333333333,0.5882352941176471,1);
+  const float e4 = 0.5;
+  const vec4 v4 = vec4(0.796078431372549,0.27450980392156865,0.4745098039215686,1);
+  const float e5 = 0.63;
+  const vec4 v5 = vec4(0.8980392156862745,0.4196078431372549,0.36470588235294116,1);
+  const float e6 = 0.75;
+  const vec4 v6 = vec4(0.9725490196078431,0.5803921568627451,0.2549019607843137,1);
+  const float e7 = 0.88;
+  const vec4 v7 = vec4(0.9921568627450981,0.7647058823529411,0.1568627450980392,1);
+  const float e8 = 1.0;
+  const vec4 v8 = vec4(0.9411764705882353,0.9764705882352941,0.12941176470588237,1);
+  float a0 = smoothstep(e0,e1,x_4);
+  float a1 = smoothstep(e1,e2,x_4);
+  float a2 = smoothstep(e2,e3,x_4);
+  float a3 = smoothstep(e3,e4,x_4);
+  float a4 = smoothstep(e4,e5,x_4);
+  float a5 = smoothstep(e5,e6,x_4);
+  float a6 = smoothstep(e6,e7,x_4);
+  float a7 = smoothstep(e7,e8,x_4);
+  return max(mix(v0,v1,a0)*step(e0,x_4)*step(x_4,e1),
+    max(mix(v1,v2,a1)*step(e1,x_4)*step(x_4,e2),
+    max(mix(v2,v3,a2)*step(e2,x_4)*step(x_4,e3),
+    max(mix(v3,v4,a3)*step(e3,x_4)*step(x_4,e4),
+    max(mix(v4,v5,a4)*step(e4,x_4)*step(x_4,e5),
+    max(mix(v5,v6,a5)*step(e5,x_4)*step(x_4,e6),
+    max(mix(v6,v7,a6)*step(e6,x_4)*step(x_4,e7),mix(v7,v8,a7)*step(e7,x_4)*step(x_4,e8)
+  )))))));
+}
+
+vec4 viridis (float x_1) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0.26666666666666666,0.00392156862745098,0.32941176470588235,1);
+  const float e1 = 0.13;
+  const vec4 v1 = vec4(0.2784313725490196,0.17254901960784313,0.47843137254901963,1);
+  const float e2 = 0.25;
+  const vec4 v2 = vec4(0.23137254901960785,0.3176470588235294,0.5450980392156862,1);
+  const float e3 = 0.38;
+  const vec4 v3 = vec4(0.17254901960784313,0.44313725490196076,0.5568627450980392,1);
+  const float e4 = 0.5;
+  const vec4 v4 = vec4(0.12941176470588237,0.5647058823529412,0.5529411764705883,1);
+  const float e5 = 0.63;
+  const vec4 v5 = vec4(0.15294117647058825,0.6784313725490196,0.5058823529411764,1);
+  const float e6 = 0.75;
+  const vec4 v6 = vec4(0.3607843137254902,0.7843137254901961,0.38823529411764707,1);
+  const float e7 = 0.88;
+  const vec4 v7 = vec4(0.6666666666666666,0.8627450980392157,0.19607843137254902,1);
+  const float e8 = 1.0;
+  const vec4 v8 = vec4(0.9921568627450981,0.9058823529411765,0.1450980392156863,1);
+  float a0 = smoothstep(e0,e1,x_1);
+  float a1 = smoothstep(e1,e2,x_1);
+  float a2 = smoothstep(e2,e3,x_1);
+  float a3 = smoothstep(e3,e4,x_1);
+  float a4 = smoothstep(e4,e5,x_1);
+  float a5 = smoothstep(e5,e6,x_1);
+  float a6 = smoothstep(e6,e7,x_1);
+  float a7 = smoothstep(e7,e8,x_1);
+  return max(mix(v0,v1,a0)*step(e0,x_1)*step(x_1,e1),
+    max(mix(v1,v2,a1)*step(e1,x_1)*step(x_1,e2),
+    max(mix(v2,v3,a2)*step(e2,x_1)*step(x_1,e3),
+    max(mix(v3,v4,a3)*step(e3,x_1)*step(x_1,e4),
+    max(mix(v4,v5,a4)*step(e4,x_1)*step(x_1,e5),
+    max(mix(v5,v6,a5)*step(e5,x_1)*step(x_1,e6),
+    max(mix(v6,v7,a6)*step(e6,x_1)*step(x_1,e7),mix(v7,v8,a7)*step(e7,x_1)*step(x_1,e8)
+  )))))));
+}
+
+vec4 greys (float x_10) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0,1);
+  const float e1 = 1.0;
+  const vec4 v1 = vec4(1,1,1,1);
+  float a0 = smoothstep(e0,e1,x_10);
+  return mix(v0,v1,a0)*step(e0,x_10)*step(x_10,e1);
+}
+
+vec4 magma (float x_7) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0.01568627450980392,1);
+  const float e1 = 0.13;
+  const vec4 v1 = vec4(0.10980392156862745,0.06274509803921569,0.26666666666666666,1);
+  const float e2 = 0.25;
+  const vec4 v2 = vec4(0.30980392156862746,0.07058823529411765,0.4823529411764706,1);
+  const float e3 = 0.38;
+  const vec4 v3 = vec4(0.5058823529411764,0.1450980392156863,0.5058823529411764,1);
+  const float e4 = 0.5;
+  const vec4 v4 = vec4(0.7098039215686275,0.21176470588235294,0.47843137254901963,1);
+  const float e5 = 0.63;
+  const vec4 v5 = vec4(0.8980392156862745,0.3137254901960784,0.39215686274509803,1);
+  const float e6 = 0.75;
+  const vec4 v6 = vec4(0.984313725490196,0.5294117647058824,0.3803921568627451,1);
+  const float e7 = 0.88;
+  const vec4 v7 = vec4(0.996078431372549,0.7607843137254902,0.5294117647058824,1);
+  const float e8 = 1.0;
+  const vec4 v8 = vec4(0.9882352941176471,0.9921568627450981,0.7490196078431373,1);
+  float a0 = smoothstep(e0,e1,x_7);
+  float a1 = smoothstep(e1,e2,x_7);
+  float a2 = smoothstep(e2,e3,x_7);
+  float a3 = smoothstep(e3,e4,x_7);
+  float a4 = smoothstep(e4,e5,x_7);
+  float a5 = smoothstep(e5,e6,x_7);
+  float a6 = smoothstep(e6,e7,x_7);
+  float a7 = smoothstep(e7,e8,x_7);
+  return max(mix(v0,v1,a0)*step(e0,x_7)*step(x_7,e1),
+    max(mix(v1,v2,a1)*step(e1,x_7)*step(x_7,e2),
+    max(mix(v2,v3,a2)*step(e2,x_7)*step(x_7,e3),
+    max(mix(v3,v4,a3)*step(e3,x_7)*step(x_7,e4),
+    max(mix(v4,v5,a4)*step(e4,x_7)*step(x_7,e5),
+    max(mix(v5,v6,a5)*step(e5,x_7)*step(x_7,e6),
+    max(mix(v6,v7,a6)*step(e6,x_7)*step(x_7,e7),mix(v7,v8,a7)*step(e7,x_7)*step(x_7,e8)
+  )))))));
+}
+
+vec4 jet (float x_8) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0.5137254901960784,1);
+  const float e1 = 0.125;
+  const vec4 v1 = vec4(0,0.23529411764705882,0.6666666666666666,1);
+  const float e2 = 0.375;
+  const vec4 v2 = vec4(0.0196078431372549,1,1,1);
+  const float e3 = 0.625;
+  const vec4 v3 = vec4(1,1,0,1);
+  const float e4 = 0.875;
+  const vec4 v4 = vec4(0.9803921568627451,0,0,1);
+  const float e5 = 1.0;
+  const vec4 v5 = vec4(0.5019607843137255,0,0,1);
+  float a0 = smoothstep(e0,e1,x_8);
+  float a1 = smoothstep(e1,e2,x_8);
+  float a2 = smoothstep(e2,e3,x_8);
+  float a3 = smoothstep(e3,e4,x_8);
+  float a4 = smoothstep(e4,e5,x_8);
+  return max(mix(v0,v1,a0)*step(e0,x_8)*step(x_8,e1),
+    max(mix(v1,v2,a1)*step(e1,x_8)*step(x_8,e2),
+    max(mix(v2,v3,a2)*step(e2,x_8)*step(x_8,e3),
+    max(mix(v3,v4,a3)*step(e3,x_8)*step(x_8,e4),mix(v4,v5,a4)*step(e4,x_8)*step(x_8,e5)
+  ))));
+}
+
+vec4 bone (float x_11) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0,1);
+  const float e1 = 0.376;
+  const vec4 v1 = vec4(0.32941176470588235,0.32941176470588235,0.4549019607843137,1);
+  const float e2 = 0.753;
+  const vec4 v2 = vec4(0.6627450980392157,0.7843137254901961,0.7843137254901961,1);
+  const float e3 = 1.0;
+  const vec4 v3 = vec4(1,1,1,1);
+  float a0 = smoothstep(e0,e1,x_11);
+  float a1 = smoothstep(e1,e2,x_11);
+  float a2 = smoothstep(e2,e3,x_11);
+  return max(mix(v0,v1,a0)*step(e0,x_11)*step(x_11,e1),
+    max(mix(v1,v2,a1)*step(e1,x_11)*step(x_11,e2),mix(v2,v3,a2)*step(e2,x_11)*step(x_11,e3)
+  ));
+}
+
+vec4 copper (float x_6) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0,1);
+  const float e1 = 0.804;
+  const vec4 v1 = vec4(1,0.6274509803921569,0.4,1);
+  const float e2 = 1.0;
+  const vec4 v2 = vec4(1,0.7803921568627451,0.4980392156862745,1);
+  float a0 = smoothstep(e0,e1,x_6);
+  float a1 = smoothstep(e1,e2,x_6);
+  return max(mix(v0,v1,a0)*step(e0,x_6)*step(x_6,e1),mix(v1,v2,a1)*step(e1,x_6)*step(x_6,e2)
+  );
+}
+
+vec4 density (float x_5) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0.21176470588235294,0.054901960784313725,0.1411764705882353,1);
+  const float e1 = 0.13;
+  const vec4 v1 = vec4(0.34901960784313724,0.09019607843137255,0.3137254901960784,1);
+  const float e2 = 0.25;
+  const vec4 v2 = vec4(0.43137254901960786,0.17647058823529413,0.5176470588235295,1);
+  const float e3 = 0.38;
+  const vec4 v3 = vec4(0.47058823529411764,0.30196078431372547,0.6980392156862745,1);
+  const float e4 = 0.5;
+  const vec4 v4 = vec4(0.47058823529411764,0.44313725490196076,0.8352941176470589,1);
+  const float e5 = 0.63;
+  const vec4 v5 = vec4(0.45098039215686275,0.592156862745098,0.8941176470588236,1);
+  const float e6 = 0.75;
+  const vec4 v6 = vec4(0.5254901960784314,0.7254901960784313,0.8901960784313725,1);
+  const float e7 = 0.88;
+  const vec4 v7 = vec4(0.6941176470588235,0.8392156862745098,0.8901960784313725,1);
+  const float e8 = 1.0;
+  const vec4 v8 = vec4(0.9019607843137255,0.9450980392156862,0.9450980392156862,1);
+  float a0 = smoothstep(e0,e1,x_5);
+  float a1 = smoothstep(e1,e2,x_5);
+  float a2 = smoothstep(e2,e3,x_5);
+  float a3 = smoothstep(e3,e4,x_5);
+  float a4 = smoothstep(e4,e5,x_5);
+  float a5 = smoothstep(e5,e6,x_5);
+  float a6 = smoothstep(e6,e7,x_5);
+  float a7 = smoothstep(e7,e8,x_5);
+  return max(mix(v0,v1,a0)*step(e0,x_5)*step(x_5,e1),
+    max(mix(v1,v2,a1)*step(e1,x_5)*step(x_5,e2),
+    max(mix(v2,v3,a2)*step(e2,x_5)*step(x_5,e3),
+    max(mix(v3,v4,a3)*step(e3,x_5)*step(x_5,e4),
+    max(mix(v4,v5,a4)*step(e4,x_5)*step(x_5,e5),
+    max(mix(v5,v6,a5)*step(e5,x_5)*step(x_5,e6),
+    max(mix(v6,v7,a6)*step(e6,x_5)*step(x_5,e7),mix(v7,v8,a7)*step(e7,x_5)*step(x_5,e8)
+  )))))));
+}
+
+vec4 inferno (float x_3) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0.01568627450980392,1);
+  const float e1 = 0.13;
+  const vec4 v1 = vec4(0.12156862745098039,0.047058823529411764,0.2823529411764706,1);
+  const float e2 = 0.25;
+  const vec4 v2 = vec4(0.3333333333333333,0.058823529411764705,0.42745098039215684,1);
+  const float e3 = 0.38;
+  const vec4 v3 = vec4(0.5333333333333333,0.13333333333333333,0.41568627450980394,1);
+  const float e4 = 0.5;
+  const vec4 v4 = vec4(0.7294117647058823,0.21176470588235294,0.3333333333333333,1);
+  const float e5 = 0.63;
+  const vec4 v5 = vec4(0.8901960784313725,0.34901960784313724,0.2,1);
+  const float e6 = 0.75;
+  const vec4 v6 = vec4(0.9764705882352941,0.5490196078431373,0.0392156862745098,1);
+  const float e7 = 0.88;
+  const vec4 v7 = vec4(0.9764705882352941,0.788235294117647,0.19607843137254902,1);
+  const float e8 = 1.0;
+  const vec4 v8 = vec4(0.9882352941176471,1,0.6431372549019608,1);
+  float a0 = smoothstep(e0,e1,x_3);
+  float a1 = smoothstep(e1,e2,x_3);
+  float a2 = smoothstep(e2,e3,x_3);
+  float a3 = smoothstep(e3,e4,x_3);
+  float a4 = smoothstep(e4,e5,x_3);
+  float a5 = smoothstep(e5,e6,x_3);
+  float a6 = smoothstep(e6,e7,x_3);
+  float a7 = smoothstep(e7,e8,x_3);
+  return max(mix(v0,v1,a0)*step(e0,x_3)*step(x_3,e1),
+    max(mix(v1,v2,a1)*step(e1,x_3)*step(x_3,e2),
+    max(mix(v2,v3,a2)*step(e2,x_3)*step(x_3,e3),
+    max(mix(v3,v4,a3)*step(e3,x_3)*step(x_3,e4),
+    max(mix(v4,v5,a4)*step(e4,x_3)*step(x_3,e5),
+    max(mix(v5,v6,a5)*step(e5,x_3)*step(x_3,e6),
+    max(mix(v6,v7,a6)*step(e6,x_3)*step(x_3,e7),mix(v7,v8,a7)*step(e7,x_3)*step(x_3,e8)
+  )))))));
+}
+
+vec4 cool (float x_2) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0.49019607843137253,0,0.7019607843137254,1);
+  const float e1 = 0.13;
+  const vec4 v1 = vec4(0.4549019607843137,0,0.8549019607843137,1);
+  const float e2 = 0.25;
+  const vec4 v2 = vec4(0.3843137254901961,0.2901960784313726,0.9294117647058824,1);
+  const float e3 = 0.38;
+  const vec4 v3 = vec4(0.26666666666666666,0.5725490196078431,0.9058823529411765,1);
+  const float e4 = 0.5;
+  const vec4 v4 = vec4(0,0.8,0.7725490196078432,1);
+  const float e5 = 0.63;
+  const vec4 v5 = vec4(0,0.9686274509803922,0.5725490196078431,1);
+  const float e6 = 0.75;
+  const vec4 v6 = vec4(0,1,0.34509803921568627,1);
+  const float e7 = 0.88;
+  const vec4 v7 = vec4(0.1568627450980392,1,0.03137254901960784,1);
+  const float e8 = 1.0;
+  const vec4 v8 = vec4(0.5764705882352941,1,0,1);
+  float a0 = smoothstep(e0,e1,x_2);
+  float a1 = smoothstep(e1,e2,x_2);
+  float a2 = smoothstep(e2,e3,x_2);
+  float a3 = smoothstep(e3,e4,x_2);
+  float a4 = smoothstep(e4,e5,x_2);
+  float a5 = smoothstep(e5,e6,x_2);
+  float a6 = smoothstep(e6,e7,x_2);
+  float a7 = smoothstep(e7,e8,x_2);
+  return max(mix(v0,v1,a0)*step(e0,x_2)*step(x_2,e1),
+    max(mix(v1,v2,a1)*step(e1,x_2)*step(x_2,e2),
+    max(mix(v2,v3,a2)*step(e2,x_2)*step(x_2,e3),
+    max(mix(v3,v4,a3)*step(e3,x_2)*step(x_2,e4),
+    max(mix(v4,v5,a4)*step(e4,x_2)*step(x_2,e5),
+    max(mix(v5,v6,a5)*step(e5,x_2)*step(x_2,e6),
+    max(mix(v6,v7,a6)*step(e6,x_2)*step(x_2,e7),mix(v7,v8,a7)*step(e7,x_2)*step(x_2,e8)
+  )))))));
+}
+
+vec4 hot (float x_0) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,0,1);
+  const float e1 = 0.3;
+  const vec4 v1 = vec4(0.9019607843137255,0,0,1);
+  const float e2 = 0.6;
+  const vec4 v2 = vec4(1,0.8235294117647058,0,1);
+  const float e3 = 1.0;
+  const vec4 v3 = vec4(1,1,1,1);
+  float a0 = smoothstep(e0,e1,x_0);
+  float a1 = smoothstep(e1,e2,x_0);
+  float a2 = smoothstep(e2,e3,x_0);
+  return max(mix(v0,v1,a0)*step(e0,x_0)*step(x_0,e1),
+    max(mix(v1,v2,a1)*step(e1,x_0)*step(x_0,e2),mix(v2,v3,a2)*step(e2,x_0)*step(x_0,e3)
+  ));
+}
+
+vec4 spring (float x_14) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(1,0,1,1);
+  const float e1 = 1.0;
+  const vec4 v1 = vec4(1,1,0,1);
+  float a0 = smoothstep(e0,e1,x_14);
+  return mix(v0,v1,a0)*step(e0,x_14)*step(x_14,e1);
+}
+
+vec4 summer (float x_9) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0.5019607843137255,0.4,1);
+  const float e1 = 1.0;
+  const vec4 v1 = vec4(1,1,0.4,1);
+  float a0 = smoothstep(e0,e1,x_9);
+  return mix(v0,v1,a0)*step(e0,x_9)*step(x_9,e1);
+}
+
+vec4 autumn (float x_13) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(1,0,0,1);
+  const float e1 = 1.0;
+  const vec4 v1 = vec4(1,1,0,1);
+  float a0 = smoothstep(e0,e1,x_13);
+  return mix(v0,v1,a0)*step(e0,x_13)*step(x_13,e1);
+}
+
+vec4 winter (float x_12) {
+  const float e0 = 0.0;
+  const vec4 v0 = vec4(0,0,1,1);
+  const float e1 = 1.0;
+  const vec4 v1 = vec4(0,1,0.5019607843137255,1);
+  float a0 = smoothstep(e0,e1,x_12);
+  return mix(v0,v1,a0)*step(e0,x_12)*step(x_12,e1);
+}
+`;