@macrostrat/column-components/dist/flooding-surface.cjs

React rendering primitives for stratigraphic columns

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const d3Scale = require("d3-scale");
const React = require("react");
const h = require("@macrostrat/hyper");
const d3Path = require("d3-path");
const frame = require("./frame.cjs");
const column = require("./context/column.cjs");
const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
const h__default = /* @__PURE__ */ _interopDefault(h);
function FloodingSurface(props) {
  const { scale, divisions } = React.useContext(column.ColumnContext);
  const { offsetLeft = -90, lineWidth = 50, onClick } = props;
  const floodingSurfaces = divisions.filter(
    (d) => d.flooding_surface_order != null
  );
  if (!floodingSurfaces.length) {
    return null;
  }
  return h__default.default(
    "g.flooding-surface",
    null,
    floodingSurfaces.map(function(d) {
      const y = scale(d.bottom);
      const x = offsetLeft;
      return h__default.default("line.flooding-surface", {
        transform: `translate(${x} ${y})`,
        onClick,
        key: d.id,
        strokeWidth: (6 - Math.abs(d.flooding_surface_order)) * 0.75,
        stroke: d.flooding_surface_order >= 0 ? "#ccc" : "#fcc",
        x1: 0,
        x2: lineWidth
      });
    })
  );
}
function range(start, end) {
  if (start === end) return [start];
  return [start, ...range(start + 1, end)];
}
class TriangleBars extends frame.UUIDComponent {
  constructor(props) {
    super(props);
    this.renderSurfaces = this.renderSurfaces.bind(this);
  }
  static contextType = column.ColumnContext;
  static defaultProps = {
    offsetLeft: -90,
    lineWidth: 50,
    order: 2
  };
  // @ts-ignore
  context;
  render() {
    let { offsetLeft, lineWidth, order, orders, minOrder, maxOrder } = this.props;
    const { scale, zoom, divisions } = this.context;
    if (orders == null && minOrder != null && maxOrder != null) {
      orders = range(minOrder, maxOrder);
    }
    const [bottom, top] = scale.range();
    if (orders == null && order != null) {
      orders = [order];
    }
    orders.reverse();
    const _ = d3Path.path();
    const zigZagLine = function(x0, x1, y, nzigs = 5, a = 2) {
      const xs = d3Scale.scaleLinear().domain([0, nzigs]).range([x0, x1]);
      _.lineTo(x0, y);
      for (let i = 0, end = nzigs, asc = 0 <= end; asc ? i < end : i > end; asc ? i++ : i--) {
        const x_ = xs(i);
        let y_ = y;
        if (i % 2 === 1) {
          y_ += a;
        }
        _.lineTo(x_, y_);
      }
      return _.lineTo(x1, y);
    };
    const btm = bottom - top;
    _.moveTo(-lineWidth, 0);
    zigZagLine(-lineWidth, lineWidth, btm, 16, 3);
    zigZagLine(lineWidth, -lineWidth, 0, 16, 3);
    _.closePath();
    return h__default.default("g.triangle-bars", [
      h__default.default("defs", [
        React.createElement("clipPath", { id: this.UUID }, [
          h__default.default("path", { d: _.toString(), key: this.UUID + "-path" })
        ])
      ]),
      orders.map(this.renderSurfaces)
    ]);
  }
  renderSurfaces(order, index) {
    let d, i;
    const { scale, zoom, divisions } = this.context;
    const { offsetLeft, lineWidth } = this.props;
    if (!divisions.length) {
      return null;
    }
    const w = lineWidth / 2;
    const ol = offsetLeft + lineWidth * 2 + 5;
    const surfaces = [];
    for (i = 0; i < divisions.length; i++) {
      d = divisions[i];
      const { surface_type, surface_order } = d;
      if (surface_type == null || surface_order == null) {
        continue;
      }
      if (!(surface_order <= order)) {
        continue;
      }
      const height = scale(d.bottom);
      if (surface_type === "mfs") {
        surfaces.push(["mfs", height]);
      }
      if (surface_type === "sb") {
        if (surfaces.length === 0) {
          surfaces.push(["sb", height]);
          continue;
        }
        const sz = surfaces.length - 1;
        if (surfaces[sz][0] === "sb") {
          surfaces[sz][1] = height;
        } else {
          surfaces.push(["sb", height]);
        }
      }
    }
    if (!surfaces.length) {
      return null;
    }
    const _ = d3Path.path();
    let basalMFS = null;
    let sequenceBoundary = null;
    for (i = 0; i < surfaces.length; i++) {
      const top = surfaces[i];
      if (top[0] === "mfs" && basalMFS != null) {
        _.moveTo(0, basalMFS[1]);
        if (sequenceBoundary != null) {
          _.lineTo(w, sequenceBoundary[1]);
          _.lineTo(0, top[1]);
          _.lineTo(-w, sequenceBoundary[1]);
          _.closePath();
        } else {
          _.lineTo(w, top[1]);
          _.lineTo(-w, top[1]);
          _.closePath();
        }
        sequenceBoundary = null;
        basalMFS = null;
      }
      if (top[0] === "mfs") {
        basalMFS = top;
      } else if (top[0] === "sb") {
        sequenceBoundary = top;
      }
    }
    return h__default.default(
      `g.level-${order}`,
      {
        clipPath: `url(#${this.UUID})`,
        transform: `translate(${-lineWidth * (2 + index) + ol})`,
        key: this.UUID + "-" + order
      },
      [h__default.default("path", { d: _.toString(), key: this.UUID + "-" + order })]
    );
  }
}
exports.FloodingSurface = FloodingSurface;
exports.TriangleBars = TriangleBars;
//# sourceMappingURL=flooding-surface.cjs.map