Dmax : Max( distance de la perpendiculaire entre chaque sommet d'un polygone et le vecteur [End, Start] du même polygone) = <b id="hmax">This text is bold</b>
<div class="preview">
  <p>2D straight skeleton after post processing preview</p>
  <canvas id="canvas2d"></canvas>
</div>

import { Vector2 } from "https://esm.sh/three";

const skeletonPostProcessingResult = {
  polygons: [
    {
      vertices: [],
      edgeStart: {
        x: 259505.3125,
        y: 6253223.5
      },
      edgeEnd: {
        x: 259521.140625,
        y: 6253168
      }
    },
    {
      vertices: [
        {
          x: 259606.34375,
          y: 6253192.5
        },
        {
          x: 259598.453125,
          y: 6253220.25
        },
        {
          x: 259513.2265625,
          y: 6253195.75
        },
        {
          x: 259521.140625,
          y: 6253168
        }
      ],
      edgeStart: {
        x: 259521.140625,
        y: 6253168
      },
      edgeEnd: {
        x: 259606.34375,
        y: 6253192.5
      }
    },
    {
      vertices: [],
      edgeStart: {
        x: 259606.34375,
        y: 6253192.5
      },
      edgeEnd: {
        x: 259590.5625,
        y: 6253248
      }
    },
    {
      vertices: [
        {
          x: 259505.3125,
          y: 6253223.5
        },
        {
          x: 259513.2265625,
          y: 6253195.75
        },
        {
          x: 259598.453125,
          y: 6253220.25
        },
        {
          x: 259590.5625,
          y: 6253248
        }
      ],
      edgeStart: {
        x: 259590.5625,
        y: 6253248
      },
      edgeEnd: {
        x: 259505.3125,
        y: 6253223.5
      }
    }
  ]
};

const skeletonBox = {
  maxX: 259606.34375,
  maxY: 6253248,
  minX: 259505.3125,
  minY: 6253168 - 20
};

const draw2d = (skeletonBox, skeletonResult) => {
  // 2D canvas
  const canvas2d = document.getElementById("canvas2d");
  const ctx = canvas2d.getContext("2d");

  canvas2d.width = canvas2d.clientWidth * window.devicePixelRatio;
  canvas2d.height = canvas2d.clientHeight * window.devicePixelRatio;

  ctx.fillStyle = "#eee";
  ctx.fillRect(0, 0, canvas2d.width, canvas2d.height);

  const padding = 15 * window.devicePixelRatio;
  const scale = Math.min(
    (canvas2d.width - padding * 2) / (skeletonBox.maxX - skeletonBox.minX),
    (canvas2d.height - padding * 2) / (skeletonBox.maxY - skeletonBox.minY)
  );
  const offsetX =
    (canvas2d.width - (skeletonBox.maxX - skeletonBox.minX) * scale) / 2;
  const offsetY =
    (canvas2d.height - (skeletonBox.maxY - skeletonBox.minY) * scale) / 2;

  ctx.strokeStyle = "#000";
  ctx.lineWidth = window.devicePixelRatio;
  ctx.fillStyle = "#ffb6e9";
  const vertices = [];

  for (const polygon of skeletonResult.polygons) {
    ctx.beginPath();
    for (let i = 0; i < polygon.vertices.length; i++) {
      const vertex = polygon.vertices[i];
      let x = (vertex.x - skeletonBox.minX) * scale + offsetX;
      let y = (vertex.y - skeletonBox.minY) * scale + offsetY;

      let isFirstPolygon =
        skeletonResult.polygons
          .filter((p) => p.vertices.length > 0)
          .indexOf(polygon) == 0;
      if (isFirstPolygon) {
        y -= 20;
      }

      let position = "";
      if (i == 0) {
        position = "start";
      } else if (i == polygon.vertices.length - 1) {
        position = "end";
      }
      vertices.push([position, x, y]);

      if (i === 0) {
        ctx.moveTo(x, y);
      } else {
        ctx.lineTo(x, y);
      }
    }

    ctx.closePath();
    ctx.stroke();
    ctx.fill();
  }

  for (const vertice of vertices) {
    ctx.beginPath();
    ctx.fillStyle = "black";
    ctx.font = "25px serif";
    ctx.fillText(vertice[0], vertice[1], vertice[2]);
    ctx.fillStyle = "red";
    ctx.arc(vertice[1], vertice[2], 5, 0, Math.PI * 2);
    ctx.closePath();
    ctx.fill();
  }
};

draw2d(skeletonBox, skeletonPostProcessingResult);

const _signedDistanceToLine = function (point, line) {
  const lineVector = new Vector2().subVectors(line[1], line[0]);
  const pointVector = new Vector2().subVectors(point, line[0]);
  const cross = lineVector.x * pointVector.y - lineVector.y * pointVector.x;
  const lineLength = lineVector.length();

  return cross / lineLength;
};

const SkeletonHeights = (function () {
  let heights = [];

  for (const polygon of skeletonPostProcessingResult.polygons) {
    const edgeLine = [polygon.edgeStart, polygon.edgeEnd];

    for (const vertex of polygon.vertices) {
      const dst = _signedDistanceToLine(vertex, edgeLine);
      heights.push(dst);
    }
  }

  return heights;
})();

document.getElementById("hmax").firstChild.textContent =
  "Math.max(" +
  SkeletonHeights.join(", ") +
  ") = " +
  Math.max(...SkeletonHeights);