Merge pull request #444 from inowas/feature/2092-implement-dem-data-f…

…etching Feature/2092 - Implementat DEM data fetching
inowas · Dec 13, 2021 · 812e7ae · 812e7ae
2 parents 4093c67 + 9b1664c
commit 812e7ae
Show file tree

Hide file tree

Showing 9 changed files with 1,361 additions and 991 deletions.
diff --git a/src/scenes/shared/rasterData/rasterDataMap.tsx b/src/scenes/shared/rasterData/rasterDataMap.tsx
@@ -1,13 +1,17 @@
-import {Array2D} from '../../../core/model/geometry/Array2D.type';
-import {BasicTileLayer} from '../../../services/geoTools/tileLayers';
-import {Children, GeoJSON, LayersControl} from 'react-leaflet';
-import {GeoJson} from '../../../core/model/geometry/Geometry.type';
-import {ILegendItem} from '../../../services/rainbowvis/types';
-import {LeafletMouseEvent} from 'leaflet';
-import {ModflowModel} from '../../../core/model/modflow';
-import {max, min} from './helpers';
-import {rainbowFactory} from '../../../services/rainbowvis/helpers';
-import {renderBoundaryOverlays, renderBoundingBoxLayer, renderContourLayer} from '../../t03/components/maps/mapLayers';
+import { Array2D } from '../../../core/model/geometry/Array2D.type';
+import { BasicTileLayer } from '../../../services/geoTools/tileLayers';
+import { Children, GeoJSON, LayersControl } from 'react-leaflet';
+import { GeoJson } from '../../../core/model/geometry/Geometry.type';
+import { ILegendItem } from '../../../services/rainbowvis/types';
+import { LeafletMouseEvent } from 'leaflet';
+import { ModflowModel } from '../../../core/model/modflow';
+import { max, min } from './helpers';
+import { rainbowFactory } from '../../../services/rainbowvis/helpers';
+import {
+  renderBoundaryOverlays,
+  renderBoundingBoxLayer,
+  renderContourLayer,
+} from '../../t03/components/maps/mapLayers';
 import BoundaryCollection from '../../../core/model/modflow/boundaries/BoundaryCollection';
 import ColorLegend from './ColorLegend';
 import CustomMap from './CustomMap';
@@ -17,43 +21,43 @@ import React from 'react';
 const styles = {
   map: {
     minHeight: 400,
-    zIndex: 1
-  }
+    zIndex: 1,
+  },
 };
 
 const renderLegend = (rainbow: Rainbow, unit = '') => {
   const gradients = rainbow.gradients.slice().reverse();
   const lastGradient = gradients[gradients.length - 1];
   const legend: ILegendItem[] = gradients.map((gradient) => ({
     color: '#' + gradient.endColor,
-    value: Number(gradient.maxNum).toExponential(2)
+    value: Number(gradient.maxNum).toExponential(2),
   }));
 
   legend.push({
     color: '#' + lastGradient.startColor,
-    value: Number(lastGradient.minNum).toExponential(2)
+    value: Number(lastGradient.minNum).toExponential(2),
   });
 
-  return <ColorLegend legend={legend} unit={unit}/>;
+  return <ColorLegend legend={legend} unit={unit} />;
 };
 
 interface IProps {
   boundaries?: BoundaryCollection;
   children?: Children;
-  data: number | Array2D<number>;
+  data?: number | Array2D<number>;
   model: ModflowModel;
   onClickCell?: (latlng: [number, number]) => void;
   unit: string;
   zones?: Array<{
     color: string;
     geometry: GeoJson;
     name: string;
-  }>
+  }>;
 }
 
 const RasterDataMap = (props: IProps) => {
-  const {children, model, data, unit} = props;
-  const rainbowVis = rainbowFactory({min: min(data), max: max(data)});
+  const { children, model, data, unit } = props;
+  const rainbowVis = data ? rainbowFactory({ min: min(data), max: max(data) }) : null;
 
   const handleClickCell = (e: LeafletMouseEvent) => {
     if (props.onClickCell) {
@@ -68,37 +72,34 @@ const RasterDataMap = (props: IProps) => {
       bounds={model.boundingBox.getBoundsLatLng()}
       onclick={props.onClickCell ? handleClickCell : undefined}
     >
-      <BasicTileLayer/>
+      <BasicTileLayer />
       {renderBoundingBoxLayer(model.boundingBox, model.rotation, model.geometry)}
-      {props.boundaries && props.boundaries.length > 0 &&
-      <LayersControl position="topright">
-        {renderBoundaryOverlays(props.boundaries)}
+      {props.boundaries && props.boundaries.length > 0 && (
+        <LayersControl position="topright">{renderBoundaryOverlays(props.boundaries)}</LayersControl>
+      )}
+      {props.zones && (
+        <LayersControl position="topright">
+          {props.zones.map((r, k) => (
+            <LayersControl.Overlay key={k} name={r.name} checked={true}>
+              <GeoJSON
+                key={k}
+                data={r.geometry}
+                style={{
+                  color: r.color,
+                  fill: false,
+                  stroke: true,
+                }}
+                priority={90}
+              />
+            </LayersControl.Overlay>
+          ))}
+        </LayersControl>
+      )}
 
-      </LayersControl>
-      }
-      {props.zones &&
-      <LayersControl position="topright">
-        {props.zones.map((r, k) => (
-          <LayersControl.Overlay key={k} name={r.name} checked={true}>
-            <GeoJSON
-              key={k}
-              data={r.geometry}
-              style={{
-                color: r.color,
-                fill: false,
-                stroke: true
-              }}
-              priority={90}
-            />
-          </LayersControl.Overlay>
-        ))}
-      </LayersControl>
-      }
-
-      {renderContourLayer({model, data, rainbow: rainbowVis, steps: 0})}
+      {data && rainbowVis && renderContourLayer({ model, data, rainbow: rainbowVis, steps: 0 })}
 
       {children}
-      {renderLegend(rainbowVis, unit)}
+      {data && rainbowVis && renderLegend(rainbowVis, unit)}
     </CustomMap>
   );
 };