Support uint16 color layers

CHANGELOG.md

@@ -11,6 +11,7 @@ For upgrade instructions, please check the [migration guide](MIGRATIONS.md).
 
 ### Added
 - Volume tasks with only one finished instance can now be viewed as CompoundTask. [#4167](https://github.com/scalableminds/webknossos/pull/4167)
+- Added support for int16 and uint16 color layers. [#4152](https://github.com/scalableminds/webknossos/pull/4152)
 
 ### Changed
 - Volume project download zips are reorganized to contain a zipfile for each annotation (that in turn contains a data.zip and an nml file). [#4167](https://github.com/scalableminds/webknossos/pull/4167)

docs/data_formats.md

@@ -7,7 +7,7 @@ webKnossos supports two data formats (WKW and KNOSSOS) for voxel datasets and NM
 * [KNOSSOS cubes](https://knossostool.org/). Dataset of 128x128x128 cubes.
 
 ### Image formats
-* Grayscale data (`uint8`), also referred to as `color` data
+* Grayscale data (8 Bit, 16 Bit, Float), also referred to as `color` data
 * RGB data (24 Bit)
 * Segmentation data (8 Bit, 16 Bit, 32 Bit)
 * Multi-channel data (multiple 8 Bit)

frontend/javascripts/oxalis/view/settings/dataset_settings_view.js

@@ -44,7 +44,7 @@ import constants, {
 } from "oxalis/constants";
 import messages, { settings } from "messages";
 
-import Histogram from "./histogram_view";
+import Histogram, { isHistogramSupported } from "./histogram_view";
 
 const { Panel } = Collapse;
 const { Option } = Select;
@@ -135,7 +135,7 @@ class DatasetSettings extends React.PureComponent<DatasetSettingsProps, State> {
     const { alpha, color, intensityRange, isDisabled } = layer;
     let histogram = new Array(256).fill(0);
     if (this.state.histograms && this.state.histograms[layerName]) {
-      histogram = this.state.histograms[layerName].histogram;
+      ({ histogram } = this.state.histograms[layerName]);
     }
 
     return (
@@ -171,7 +171,7 @@ class DatasetSettings extends React.PureComponent<DatasetSettingsProps, State> {
             {this.getFindDataButton(layerName, isDisabled)}
           </Col>
         </Row>
-        {!isDisabled && elementClass !== "float" ? (
+        {!isDisabled && isHistogramSupported(elementClass) ? (
           <Histogram
             data={histogram}
             min={intensityRange[0]}

frontend/javascripts/oxalis/view/settings/histogram_view.js

@@ -7,6 +7,7 @@ import type { Dispatch } from "redux";
 import { connect } from "react-redux";
 import { type DatasetLayerConfiguration } from "oxalis/store";
 import { updateLayerSettingAction } from "oxalis/model/actions/settings_actions";
+import { type ElementClass } from "admin/api_flow_types";
 
 type OwnProps = {|
   data: Array<number>,
@@ -27,6 +28,13 @@ type HistogramProps = {
 const canvasHeight = 100;
 const canvasWidth = 300;
 
+export function isHistogramSupported(elementClass: ElementClass): boolean {
+  if (["int8", "uint8"].includes(elementClass)) {
+    return true;
+  }
+  return false;
+}
+
 class Histogram extends React.PureComponent<HistogramProps> {
   canvasRef: ?HTMLCanvasElement;