@equinor/esv-intersection 3.1.9 → 4.1.0

package/src/control/LayerManager.ts

@@ -17,7 +17,9 @@ export class LayerManager {
   private layers: Layer<unknown>[] = [];
 
   private _axis: Axis | undefined;
-  private _svgContainer: Selection<HTMLDivElement, unknown, null, undefined> | undefined;
+  private _svgContainer:
+    | Selection<HTMLDivElement, unknown, null, undefined>
+    | undefined;
 
   /**
    * Handles layers and axis also holds a zoom and pan handler object
@@ -25,16 +27,30 @@ export class LayerManager {
    * @param scaleOptions
    * @param axisOptions
    */
-  constructor(container: HTMLElement, scaleOptions?: ScaleOptions, axisOptions?: AxisOptions) {
+  constructor(
+    container: HTMLElement,
+    scaleOptions?: ScaleOptions,
+    axisOptions?: AxisOptions,
+  ) {
     this.container = container;
     this.layerContainer = document.createElement('div');
     this.layerContainer.className = 'layer-container';
     this.container.appendChild(this.layerContainer);
-    this.adjustToSize(+(this.container.getAttribute('width') ?? 0), +(this.container.getAttribute('height') ?? 0));
-    this._zoomPanHandler = new ZoomPanHandler(container, (event) => this.rescale(event));
+    this.adjustToSize(
+      +(this.container.getAttribute('width') ?? 0),
+      +(this.container.getAttribute('height') ?? 0),
+    );
+    this._zoomPanHandler = new ZoomPanHandler(container, event =>
+      this.rescale(event),
+    );
     if (scaleOptions) {
       const { xMin, xMax, yMin, yMax, xBounds, yBounds } = scaleOptions;
-      if (xMin !== undefined && xMax !== undefined && yMin !== undefined && yMax !== undefined) {
+      if (
+        xMin !== undefined &&
+        xMax !== undefined &&
+        yMin !== undefined &&
+        yMax !== undefined
+      ) {
         this._zoomPanHandler.setBounds([xMin, xMax], [yMin, yMax]);
       }
       if (xBounds && yBounds) {
@@ -56,7 +72,7 @@ export class LayerManager {
    * @param layers array of layers
    */
   addLayers(layers: Layer<unknown>[]): LayerManager {
-    layers.forEach((layer) => this.addLayer(layer));
+    layers.forEach(layer => this.addLayer(layer));
     return this;
   }
 
@@ -72,7 +88,7 @@ export class LayerManager {
    * @param includeReferenceSystem - (optional) if true also removes reference system, default is true
    */
   clearAllData(includeReferenceSystem = true): LayerManager {
-    this.layers.forEach((l) => l.clearData(includeReferenceSystem));
+    this.layers.forEach(l => l.clearData(includeReferenceSystem));
     return this;
   }
 
@@ -81,7 +97,10 @@ export class LayerManager {
    * @param layer Layer
    * @param params extra params to pass to the onUpdate method
    */
-  addLayer(layer: Layer<unknown>, params?: LayerOptions<unknown>): LayerManager {
+  addLayer(
+    layer: Layer<unknown>,
+    params?: LayerOptions<unknown>,
+  ): LayerManager {
     this.layers.push(layer);
     this.initLayer(layer, params);
 
@@ -93,10 +112,10 @@ export class LayerManager {
    * @param layerId name of layer
    */
   removeLayer(layerId: string): LayerManager {
-    const layer = this.layers.find((l) => l.id === layerId);
+    const layer = this.layers.find(l => l.id === layerId);
     if (layer) {
       layer.onUnmount();
-      this.layers = this.layers.filter((l) => l.id !== layerId);
+      this.layers = this.layers.filter(l => l.id !== layerId);
     }
 
     return this;
@@ -107,17 +126,22 @@ export class LayerManager {
    */
   removeAllLayers(): LayerManager {
     const { layers } = this;
-    layers.forEach((layer) => {
+    layers.forEach(layer => {
       this.removeLayer(layer.id);
     });
     return this;
   }
 
   getLayer(layerId: string): Layer<unknown> | undefined {
-    return this.layers.find((l) => l.id === layerId || l.getInternalLayerIds().includes(layerId));
+    return this.layers.find(
+      l => l.id === layerId || l.getInternalLayerIds().includes(layerId),
+    );
   }
 
-  initLayer(layer: Layer<unknown>, params?: LayerOptions<unknown>): LayerManager {
+  initLayer(
+    layer: Layer<unknown>,
+    params?: LayerOptions<unknown>,
+  ): LayerManager {
     const event: OnMountEvent = {
       elm: this.layerContainer,
     };
@@ -127,7 +151,12 @@ export class LayerManager {
     layer.onRescale(rescaleEvent);
 
     if (this._svgContainer) {
-      const highestZIndex = this.layers.length > 0 ? this.layers.reduce((max, layers) => (max.order > layers.order ? max : layers)).order : 1;
+      const highestZIndex =
+        this.layers.length > 0
+          ? this.layers.reduce((max, layers) =>
+              max.order > layers.order ? max : layers,
+            ).order
+          : 1;
       this._svgContainer.style('z-index', `${highestZIndex + 1}`);
     }
 
@@ -160,8 +189,14 @@ export class LayerManager {
    * @param height (required)
    */
   adjustToSize(width: number, height: number): void {
-    const layersWidth = Math.max(this._axis ? width - HORIZONTAL_AXIS_MARGIN : width, 0);
-    const layersHeight = Math.max(this._axis ? height - VERTICAL_AXIS_MARGIN : height, 0);
+    const layersWidth = Math.max(
+      this._axis ? width - HORIZONTAL_AXIS_MARGIN : width,
+      0,
+    );
+    const layersHeight = Math.max(
+      this._axis ? height - VERTICAL_AXIS_MARGIN : height,
+      0,
+    );
 
     if (this._axis) {
       const resizeEvent = { width, height };
@@ -169,7 +204,7 @@ export class LayerManager {
     }
     if (this.layers) {
       const resizeEvent = { width: layersWidth, height: layersHeight };
-      this.layers.forEach((layer) => layer.onResize(resizeEvent));
+      this.layers.forEach(layer => layer.onResize(resizeEvent));
     }
     if (this._zoomPanHandler) {
       this._zoomPanHandler.adjustToSize(layersWidth, layersHeight, true);
@@ -177,7 +212,7 @@ export class LayerManager {
   }
 
   setReferenceSystem(irs: IntersectionReferenceSystem): void {
-    this.layers.forEach((layer) => (layer.referenceSystem = irs));
+    this.layers.forEach(layer => (layer.referenceSystem = irs));
   }
 
   showAxis(): LayerManager {
@@ -204,7 +239,9 @@ export class LayerManager {
     if (this._axis) {
       this._axis.offsetX = x;
       this._axis.offsetY = y;
-      const gridLayers = this.layers.filter((l: Layer<unknown>): l is GridLayer<unknown> => l instanceof GridLayer);
+      const gridLayers = this.layers.filter(
+        (l: Layer<unknown>): l is GridLayer<unknown> => l instanceof GridLayer,
+      );
       gridLayers.forEach((l: GridLayer<unknown>) => {
         l.offsetX = x;
         l.offsetY = y;
@@ -216,7 +253,9 @@ export class LayerManager {
   setXAxisOffset(x: number): LayerManager {
     if (this._axis) {
       this._axis.offsetX = x;
-      const gridLayers = this.layers.filter((l: Layer<unknown>): l is GridLayer<unknown> => l instanceof GridLayer);
+      const gridLayers = this.layers.filter(
+        (l: Layer<unknown>): l is GridLayer<unknown> => l instanceof GridLayer,
+      );
       gridLayers.forEach((l: GridLayer<unknown>) => {
         l.offsetX = x;
       });
@@ -227,7 +266,9 @@ export class LayerManager {
   setYAxisOffset(y: number): LayerManager {
     if (this._axis) {
       this._axis.offsetY = y;
-      const gridLayers = this.layers.filter((l: Layer<unknown>): l is GridLayer<unknown> => l instanceof GridLayer);
+      const gridLayers = this.layers.filter(
+        (l: Layer<unknown>): l is GridLayer<unknown> => l instanceof GridLayer,
+      );
       gridLayers.forEach((l: GridLayer<unknown>) => {
         l.offsetY = y;
       });
@@ -272,7 +313,9 @@ export class LayerManager {
       this._axis.onRescale(event);
     }
     if (this.layers) {
-      this.layers.forEach((layer) => (layer.isVisible === true ? layer.onRescale(event) : {}));
+      this.layers.forEach(layer =>
+        layer.isVisible === true ? layer.onRescale(event) : {},
+      );
     }
   }
 
@@ -285,11 +328,20 @@ export class LayerManager {
       .style('z-index', '10')
       .style('pointer-events', 'none');
 
-    const svg = this._svgContainer.append('svg').attr('height', `${container.offsetHeight}px`).attr('width', `${container.offsetWidth}px`);
+    const svg = this._svgContainer
+      .append('svg')
+      .attr('height', `${container.offsetHeight}px`)
+      .attr('width', `${container.offsetWidth}px`);
 
     const showLabels = true;
 
-    const axis = new Axis(svg, showLabels, options.xLabel, options.yLabel, options.unitOfMeasure);
+    const axis = new Axis(
+      svg,
+      showLabels,
+      options.xLabel,
+      options.yLabel,
+      options.unitOfMeasure,
+    );
 
     return axis;
   };

package/src/control/MainController.ts

@@ -30,13 +30,25 @@ export class Controller {
    * @param options.referenceSystem (optional) sets reference system, takes priority over path if both are supplied
    */
   constructor(options: ControllerOptions) {
-    const { container, axisOptions, scaleOptions, referenceSystem, layers, path } = options;
-
-    this._referenceSystem = referenceSystem || (path && new IntersectionReferenceSystem(path));
+    const {
+      container,
+      axisOptions,
+      scaleOptions,
+      referenceSystem,
+      layers,
+      path,
+    } = options;
+
+    this._referenceSystem =
+      referenceSystem || (path && new IntersectionReferenceSystem(path));
 
     this._overlay = overlay(this, container);
 
-    this.layerManager = new LayerManager(this._overlay.elm.node() as HTMLElement, scaleOptions, axisOptions);
+    this.layerManager = new LayerManager(
+      this._overlay.elm.node() as HTMLElement,
+      scaleOptions,
+      axisOptions,
+    );
     if (layers) {
       this.layerManager.addLayers(layers);
       this.setOverlayZIndex(layers);
@@ -136,8 +148,15 @@ export class Controller {
   adjustToSize(width: number, height: number): Controller {
     this.layerManager.adjustToSize(width, height);
 
-    const dimensions = { width: Math.max(width - HORIZONTAL_AXIS_MARGIN, 0), height: Math.max(height - VERTICAL_AXIS_MARGIN, 0) };
-    this.overlay.elm.dispatch('resize', { detail: dimensions, bubbles: true, cancelable: true });
+    const dimensions = {
+      width: Math.max(width - HORIZONTAL_AXIS_MARGIN, 0),
+      height: Math.max(height - VERTICAL_AXIS_MARGIN, 0),
+    };
+    this.overlay.elm.dispatch('resize', {
+      detail: dimensions,
+      bubbles: true,
+      cancelable: true,
+    });
 
     return this;
   }
@@ -149,7 +168,12 @@ export class Controller {
    * @param  displ - displacement
    * @param  duration - duration of transition
    */
-  setViewport(cx?: number, cy?: number, displacement?: number, duration?: number): Controller {
+  setViewport(
+    cx?: number,
+    cy?: number,
+    displacement?: number,
+    duration?: number,
+  ): Controller {
     this.zoomPanHandler.setViewport(cx, cy, displacement, duration);
     return this;
   }
@@ -263,7 +287,12 @@ export class Controller {
   }
 
   private getHighestZIndex(layers: Layer<unknown>[]): number {
-    const highestZIndex = layers.length > 0 ? layers.reduce((max, layers) => (max.order > layers.order ? max : layers)).order : 1;
+    const highestZIndex =
+      layers.length > 0
+        ? layers.reduce((max, layers) =>
+            max.order > layers.order ? max : layers,
+          ).order
+        : 1;
     return highestZIndex;
   }
 

package/src/control/ZoomPanHandler.ts

@@ -34,7 +34,10 @@ export class ZoomPanHandler {
   constructor(
     elm: HTMLElement,
     onRescale: RescaleFunction,
-    options: ZoomAndPanOptions = { maxZoomLevel: DEFAULT_MAX_ZOOM_LEVEL, minZoomLevel: DEFAULT_MIN_ZOOM_LEVEL },
+    options: ZoomAndPanOptions = {
+      maxZoomLevel: DEFAULT_MAX_ZOOM_LEVEL,
+      minZoomLevel: DEFAULT_MIN_ZOOM_LEVEL,
+    },
   ) {
     this.container = select(elm);
     this.options = options;
@@ -180,7 +183,14 @@ export class ZoomPanHandler {
    * Update translate extent (pan limits)
    */
   updateTranslateExtent(): void {
-    const { width, xSpan, zFactor, enableTranslateExtent, translateBoundsX, translateBoundsY } = this;
+    const {
+      width,
+      xSpan,
+      zFactor,
+      enableTranslateExtent,
+      translateBoundsX,
+      translateBoundsY,
+    } = this;
 
     let x1 = -Infinity;
     let y1 = -Infinity;
@@ -206,7 +216,19 @@ export class ZoomPanHandler {
    * Create an event object from current state
    */
   currentStateAsEvent(): OnRescaleEvent {
-    const { scaleX, scaleY, xBounds, yBounds, zFactor, viewportRatio, currentTransform, xRatio, yRatio, width, height } = this;
+    const {
+      scaleX,
+      scaleY,
+      xBounds,
+      yBounds,
+      zFactor,
+      viewportRatio,
+      currentTransform,
+      xRatio,
+      yRatio,
+      width,
+      height,
+    } = this;
 
     return {
       xScale: scaleX.copy(),
@@ -236,7 +258,9 @@ export class ZoomPanHandler {
    * Initialized handler
    */
   init(): void {
-    this.zoom = zoom<HTMLElement, unknown>().scaleExtent([this.options.minZoomLevel, this.options.maxZoomLevel]).on('zoom', this.onZoom);
+    this.zoom = zoom<HTMLElement, unknown>()
+      .scaleExtent([this.options.minZoomLevel, this.options.maxZoomLevel])
+      .on('zoom', this.onZoom);
     this.container.call(this.zoom);
   }
 
@@ -287,8 +311,14 @@ export class ZoomPanHandler {
    * @param  duration - duration of transition
    * @returns  a merge of filter and payload
    */
-  setViewport(cx?: number, cy?: number, displ?: number, duration?: number): void {
-    const { zoom, container, calculateTransform, scaleX, scaleY, isXInverted } = this;
+  setViewport(
+    cx?: number,
+    cy?: number,
+    displ?: number,
+    duration?: number,
+  ): void {
+    const { zoom, container, calculateTransform, scaleX, scaleY, isXInverted } =
+      this;
 
     if (cx == null || displ == null || isNaN(cx) || isNaN(displ)) {
       const xd = scaleX.domain() as [number, number];
@@ -334,7 +364,10 @@ export class ZoomPanHandler {
   /**
    * Set bounds
    */
-  setTranslateBounds(xBounds: [number, number], yBounds: [number, number]): void {
+  setTranslateBounds(
+    xBounds: [number, number],
+    yBounds: [number, number],
+  ): void {
     this.translateBoundsX = xBounds;
     this.translateBoundsY = yBounds;
 
@@ -348,8 +381,18 @@ export class ZoomPanHandler {
   adjustToSize(): void;
   adjustToSize(autoAdjust: boolean): void;
   adjustToSize(width: number, height: number, force: boolean): void;
-  adjustToSize(widthOrAutoAdjust?: unknown, height?: number, force = false): void {
-    const { width: oldWidth, height: oldHeight, scaleX, scaleY, recalculateZoomTransform } = this;
+  adjustToSize(
+    widthOrAutoAdjust?: unknown,
+    height?: number,
+    force = false,
+  ): void {
+    const {
+      width: oldWidth,
+      height: oldHeight,
+      scaleX,
+      scaleY,
+      recalculateZoomTransform,
+    } = this;
 
     let w = 0;
     let h = 0;
@@ -360,7 +403,8 @@ export class ZoomPanHandler {
     } else {
       const containerEl = this.container.node();
       if (containerEl) {
-        const { width: containerWidth, height: containerHeight } = containerEl.getBoundingClientRect();
+        const { width: containerWidth, height: containerHeight } =
+          containerEl.getBoundingClientRect();
         w = containerWidth;
         h = containerHeight;
       }
@@ -389,7 +433,16 @@ export class ZoomPanHandler {
    * @returns  New transformation matrix
    */
   calculateTransform(dx0: number, dx1: number, dy: number): ZoomTransform {
-    const { scaleX, xSpan, xBounds, yBounds, zFactor, viewportRatio: ratio, isXInverted, isYInverted } = this;
+    const {
+      scaleX,
+      xSpan,
+      xBounds,
+      yBounds,
+      zFactor,
+      viewportRatio: ratio,
+      isXInverted,
+      isYInverted,
+    } = this;
 
     const [rx1, rx2] = scaleX.range() as [number, number];
     const displ = Math.abs(dx1 - dx0);
@@ -398,8 +451,11 @@ export class ZoomPanHandler {
 
     const dy0 = dy - (isYInverted ? -displ : displ) / zFactor / ratio / 2;
 
-    const tx = (xBounds[0] - dx0) / (isXInverted ? -unitsPerPixels : unitsPerPixels);
-    const ty = (yBounds[0] - dy0) / ((isYInverted ? -unitsPerPixels : unitsPerPixels) / zFactor);
+    const tx =
+      (xBounds[0] - dx0) / (isXInverted ? -unitsPerPixels : unitsPerPixels);
+    const ty =
+      (yBounds[0] - dy0) /
+      ((isYInverted ? -unitsPerPixels : unitsPerPixels) / zFactor);
 
     return zoomIdentity.translate(tx, ty).scale(k);
   }
@@ -408,7 +464,13 @@ export class ZoomPanHandler {
    * Recalcualate the transform
    */
   recalculateZoomTransform(): void {
-    const { scaleX, scaleY, container, calculateTransform, updateTranslateExtent } = this;
+    const {
+      scaleX,
+      scaleY,
+      container,
+      calculateTransform,
+      updateTranslateExtent,
+    } = this;
 
     const [dx0, dx1] = scaleX.domain() as [number, number];
     const [dy0, dy1] = scaleY.domain() as [number, number];

package/src/control/overlay.ts

@@ -10,11 +10,15 @@ export class Overlay<T> {
 
   constructor(caller: T, container: HTMLElement) {
     const con = select(container);
-    this.elm = con.append('div').attr('id', 'overlay').style('z-index', '11').style('position', 'absolute');
+    this.elm = con
+      .append('div')
+      .attr('id', 'overlay')
+      .style('z-index', '11')
+      .style('position', 'absolute');
     this.source = this.elm.node() ?? undefined;
 
     const { elm } = this;
-    elm.on('resize', (event) => {
+    elm.on('resize', event => {
       const { width, height } = event.detail;
       elm.style('width', `${width}px`).style('height', `${height}px`);
 
@@ -39,7 +43,7 @@ export class Overlay<T> {
       });
     });
 
-    elm.on('mousemove', (event) => {
+    elm.on('mousemove', event => {
       if (!this.enabled) {
         return;
       }
@@ -83,8 +87,15 @@ export class Overlay<T> {
     });
   }
 
-  create(key: string, callbacks?: OverlayCallbacks<T>): HTMLElement | undefined {
-    const newElm = this.elm.append('div').style('position', 'relative').style('pointer-events', 'none').node();
+  create(
+    key: string,
+    callbacks?: OverlayCallbacks<T>,
+  ): HTMLElement | undefined {
+    const newElm = this.elm
+      .append('div')
+      .style('position', 'relative')
+      .style('pointer-events', 'none')
+      .node();
 
     if (newElm != null) {
       this.elements[key] = newElm;
@@ -119,4 +130,5 @@ export class Overlay<T> {
   }
 }
 
-export const overlay = <T>(caller: T, container: HTMLElement): Overlay<T> => new Overlay<T>(caller, container);
+export const overlay = <T>(caller: T, container: HTMLElement): Overlay<T> =>
+  new Overlay<T>(caller, container);

package/src/datautils/colortable.ts

@@ -1,11 +1,16 @@
 import { scaleLinear } from 'd3-scale';
 import { color } from 'd3-color';
 
-export function createColorTable(colorMap: string[], size: number): [number, number, number][] {
+export function createColorTable(
+  colorMap: string[],
+  size: number,
+): [number, number, number][] {
   const colorDomain = colorMap.map((_v, i) => (i * size) / colorMap.length);
   const colorScale = scaleLinear<string>().domain(colorDomain).range(colorMap);
 
-  const table = Array.from(new Array(size).keys()).map<[number, number, number]>((i) => {
+  const table = Array.from(new Array(size).keys()).map<
+    [number, number, number]
+  >(i => {
     const rgb = color(colorScale(i))?.rgb();
     return rgb != null ? [rgb.r, rgb.g, rgb.b] : [0, 0, 0];
   });

package/src/datautils/findsample.ts

@@ -38,7 +38,12 @@ export function findIndexOfSample(data: number[][], pos: number): number {
   for (let i = a; i < b; i++) {
     const v1 = data[i]?.[0];
     const v2 = data[i + 1]?.[0];
-    if (v1 != null && v2 != null && Math.min(v1, v2) <= pos && pos <= Math.max(v1, v2)) {
+    if (
+      v1 != null &&
+      v2 != null &&
+      Math.min(v1, v2) <= pos &&
+      pos <= Math.max(v1, v2)
+    ) {
       index = i;
       break;
     }
@@ -47,7 +52,12 @@ export function findIndexOfSample(data: number[][], pos: number): number {
   return index;
 }
 
-export function findSampleAtPos(data: number[][], pos: number, topLimit = 0, bottomLimit = 0): number {
+export function findSampleAtPos(
+  data: number[][],
+  pos: number,
+  topLimit = 0,
+  bottomLimit = 0,
+): number {
   let y = 0;
   const index = findIndexOfSample(data, pos);
   if (index !== -1) {