Compute mappedArray with ndarray-ops

package.json

@@ -39,6 +39,7 @@
     "lodash-es": "^4.17.15",
     "nanoid": "^2.1.11",
     "ndarray": "^1.0.19",
+    "ndarray-ops": "^1.2.2",
     "ndarray-unpack": "^1.0.0",
     "normalize.css": "^8.0.1",
     "react": "^16.13.1",

src/h5web/visualizations/shared/MappedVis.tsx

@@ -1,7 +1,7 @@
 import React, { ReactElement, useMemo, ElementType } from 'react';
 import { isNumber } from 'lodash-es';
 import ndarray from 'ndarray';
-import unpack from 'ndarray-unpack';
+import ops from 'ndarray-ops';
 import type { DimensionMapping } from '../../dataset-visualizer/models';
 import type { HDF5Dataset, HDF5SimpleShape } from '../../providers/models';
 
@@ -34,7 +34,10 @@ function MappedVis<T>(props: Props<T>): ReactElement {
     const mappedView = isXBeforeY ? slicedView.transpose(1, 0) : slicedView;
 
     // Create ndarray from mapped view so `dataArray.data` only contains values relevant to vis
-    return ndarray<T>(unpack(mappedView).flat(), mappedView.shape);
+    const mappedArray = ndarray<T>([], mappedView.shape);
+    ops.assign(mappedArray, mappedView);
+
+    return mappedArray;
   }, [mapperState, baseArray]);
 
   return <Component dataArray={dataArray} />;

src/react-app-env.d.ts

@@ -8,3 +8,9 @@ declare module 'ndarray-unpack' {
 
   export = unpack;
 }
+
+declare module 'ndarray-ops' {
+  function assign(a: ndarray<T>, b: ndarray<T>);
+
+  export = { assign };
+}