dynamic visible channel type range

Author: MaximeBICMTL

modules/electrophysiology_browser/jsx/react-series-data-viewer/src/MutableDepCache.tsx

@@ -0,0 +1,41 @@
+/**
+ * A function to compare to objects of the same type.
+ */
+export type Comparator<T> = (a: T, b: T) => boolean;
+
+/**
+ * A dependency-aware key-value mutable cache.
+ *
+ * Only a single value is cached per key, when querying the cache, that value
+ * is recomputed it the dependencies of that entry have changed.
+ */
+export default class MutableKeyDepCache<K, D, V> {
+  private cache = new Map<K, { deps: D; value: V }>();
+  private comparator: Comparator<D>;
+
+  /**
+   * Create a new mutable key dependency cache with the given dependency
+   * comparator.
+   */
+  constructor(comparator: Comparator<D> = Object.is) {
+    this.comparator = comparator;
+  }
+
+  /**
+   * Query the cache for a value with the given key and dependencies.
+   */
+  get(key: K, deps: D, compute: () => V): V {
+    const entry = this.cache.get(key);
+
+    // If the key is present and its dependencies have not changed, return the
+    // existing value.
+    if (entry && this.comparator(entry.deps, deps)) {
+      return entry.value;
+    }
+
+    // Otherwise, recompute, cache, and return the new value.
+    const value = compute();
+    this.cache.set(key, { deps, value });
+    return value;
+  }
+}

modules/electrophysiology_browser/jsx/react-series-data-viewer/src/series/components/SeriesRenderer.tsx

@@ -78,8 +78,8 @@ import Pagination from './Pagination';
 import {SET_CHANNELS} from '../store/state/channels';
 import {UPDATE_VIEWED_CHUNKS} from '../store/logic/fetchChunks';
 import {ChannelInfosContext, ChannelMetasContext} from '../../eeglab/EEGLabSeriesProvider';
-import {getMinMaxRange} from '../../utils';
-import { number } from 'node_modules/@types/prop-types';
+import {computePercentileRange, computeMean} from '../../utils';
+import MutableKeyDepCache from '../../MutableDepCache';
 
 /**
  * The state of a channel type.
@@ -89,6 +89,47 @@ export type ChannelTypeState = {
   channelsCount: number,
 };
 
+/**
+ * The specific cache type used to cache channel ranges.
+ */
+type ChannelRangeCache = MutableKeyDepCache<
+  // The channel index.
+  number,
+  // The dependencies upon which the range depends.
+  ChannelRangeCacheDeps,
+  // The computed range.
+  [number, number]
+>
+
+/**
+ * The dependencies upon which a channel range depends.
+ */
+type ChannelRangeCacheDeps = {
+  interval: [number, number],
+  chunkIds: number[],
+}
+
+/**
+ * Check whethere two channel range cache dependencies are equal.
+ */
+function compareChannelRangeDeps(a: ChannelRangeCacheDeps, b: ChannelRangeCacheDeps): boolean {
+  if (a.interval[0] !== b.interval[0] || a.interval[1] !== b.interval[1]) {
+    return false;
+  }
+
+  if (a.chunkIds.length !== b.chunkIds.length) {
+    return false;
+  }
+
+  for (let i = 0; i < a.chunkIds.length; i += 1) {
+    if (a.chunkIds[i] !== b.chunkIds[i]) {
+      return false;
+    }
+  }
+
+  return true;
+}
+
 type CProps = {
   ref: MutableRefObject<any>,
   viewerWidth: number,
@@ -580,6 +621,11 @@ const SeriesRenderer: FunctionComponent<CProps> = ({
   vec2.add(center, topLeft, bottomRight);
   vec2.scale(center, center, 1 / 2);
 
+  // A mutable cache for the visible range of the values each channel.
+  const channelRangeCache: MutableRefObject<ChannelRangeCache> = useRef(
+    new MutableKeyDepCache(compareChannelRangeDeps)
+  );
+
   const scales: [
       ScaleLinear<number, number, never>,
       ScaleLinear<number, number, never>
@@ -729,6 +775,31 @@ const SeriesRenderer: FunctionComponent<CProps> = ({
       )
       : filteredChannels;
 
+    // Get the maximum range for each channel type based on the ranges of
+    // the visible values of each visible channel of that type.
+    const channelTypeRanges: Record<string, number> = {};
+    channelList.forEach((channel) => {
+      const bidsChannel = findBidsChannel(channelMetadata[channel.index], bidsChannels);
+      const type = bidsChannel?.ChannelType ?? 'Unknown';
+
+      // Get the visible values range of that channel, from the cache if possible.
+      const [min, max] = channelRangeCache.current.get(
+        channel.index,
+        {
+          interval,
+          chunkIds: channel.traces.flatMap((trace) => trace.chunks.map((chunk) => chunk.index)).sort(),
+        },
+        () => {console.log("RECOMPUTE"); return getChannelVisibleRange(channel, interval) }
+      );
+
+      const range = max - min;
+      if (!channelTypeRanges[type]) {
+        channelTypeRanges[type] = range;
+      } else {
+        channelTypeRanges[type] = Math.max(channelTypeRanges[type], range);
+      }
+    });
+
     return (
       <>
         <clipPath
@@ -786,14 +857,18 @@ const SeriesRenderer: FunctionComponent<CProps> = ({
                 (chunk) => chunk.values.length > 0
               ).length;
 
-              const valuesInView = getChannelVisibleValues(trace, interval);
+              const valuesInView = getTraceVisibleValues(trace, interval);
 
               if (valuesInView.length === 0) {
                 return;
               }
 
-              // Get the range of all the displayed values for this channel.
-              const seriesRange = getMinMaxRange(valuesInView);
+              // Get the range centered on the average for channels of the same type
+              const average = computeMean(valuesInView);
+              const bidsChannel = findBidsChannel(channelMetadata[channel.index], bidsChannels);
+              const type = bidsChannel?.ChannelType ?? 'Unknown';
+              const overallRange = channelTypeRanges[type] || 0;
+              const seriesRange: [number, number] = [average - overallRange / 2, average + overallRange / 2];
 
               const scales: [
                 ScaleLinear<number, number, never>,
@@ -1607,9 +1682,31 @@ SeriesRenderer.defaultProps = {
 };
 
 /**
- * Get the values of a channel that fall within the visible interval.
+ * Get the range of the visible values of a channel across all its traces.
+ */
+function getChannelVisibleRange(channel: Channel, interval: [number, number]): [number, number] {
+  let channelMin = Infinity;
+  let channelMax = -Infinity;
+
+  channel.traces.forEach((trace) => {
+    const values = getTraceVisibleValues(trace, interval);
+    if (values.length === 0) {
+      return;
+    }
+
+    const [traceMin, traceMax] = computePercentileRange(values);
+    console.log(traceMin, traceMax);
+    channelMin = Math.min(channelMin, traceMin);
+    channelMax = Math.max(channelMax, traceMax);
+  });
+
+  return [channelMin, channelMax];
+}
+
+/**
+ * Get the values of a trace that fall within the visible interval.
  */
-function getChannelVisibleValues(trace: Trace, interval: [number, number]): number[] {
+function getTraceVisibleValues(trace: Trace, interval: [number, number]): number[] {
   const [start, end] = interval;
   const values = [];
 

modules/electrophysiology_browser/jsx/react-series-data-viewer/src/utils.tsx

@@ -16,6 +16,46 @@ export function getMinMaxRange(values: number[]): [number, number] {
   return [min, max];
 }
 
+/**
+ * Get the value at the n-th percentile index in a list.
+ */
+export function getIndexPercentile(values: number[], percentile: number): number {
+  const index = Math.floor((percentile / 100) * values.length);
+  const clampedIndex = Math.min(index, values.length - 1);
+  return values[clampedIndex];
+};
+
+/**
+ * Compute the percentile range in a list of numbers.
+ */
+export function computePercentileRange(
+  values: number[],
+  lowerPercentile: number = 5,
+  upperPercentile: number = 95,
+): [number, number] {
+  if (values.length === 0) {
+    return [0, 0];
+  }
+
+  const sorted = [...values].sort((a, b) => a - b);
+
+  return [
+    getIndexPercentile(sorted, lowerPercentile),
+    getIndexPercentile(sorted, upperPercentile),
+  ];
+}
+
+/**
+ * Compute the mean in a list of numbers.
+ */
+export function computeMean(values: number[]): number {
+  if (values.length === 0) {
+    return 0;
+  }
+
+  return values.reduce((a, b) => a + b, 0) / values.length;
+}
+
 /**
  * Normalize a channel unit for visualization.
  */