modern-path2d 1.3.1 → 1.3.3

package/dist/index.mjs

@@ -1029,7 +1029,7 @@ function cubicBezier(t, p0, p1, p2, p3) {
   return cubicBezierP0(t, p0) + cubicBezierP1(t, p1) + cubicBezierP2(t, p2) + cubicBezierP3(t, p3);
 }
 
-function fillTriangulate(points, options = {}) {
+function fillTriangulate(pointArray, options = {}) {
   let {
     vertices = [],
     indices = [],
@@ -1038,17 +1038,17 @@ function fillTriangulate(points, options = {}) {
     verticesOffset = vertices.length / verticesStride,
     indicesOffset = indices.length
   } = options;
-  const triangles = earcut(points, holes, 2);
-  if (triangles) {
+  const triangles = earcut(pointArray, holes, 2);
+  if (triangles.length) {
     for (let i = 0; i < triangles.length; i += 3) {
       indices[indicesOffset++] = triangles[i] + verticesOffset;
       indices[indicesOffset++] = triangles[i + 1] + verticesOffset;
       indices[indicesOffset++] = triangles[i + 2] + verticesOffset;
     }
     let index = verticesOffset * verticesStride;
-    for (let i = 0; i < points.length; i += 2) {
-      vertices[index] = points[i];
-      vertices[index + 1] = points[i + 1];
+    for (let i = 0; i < pointArray.length; i += 2) {
+      vertices[index] = pointArray[i];
+      vertices[index + 1] = pointArray[i + 1];
       index += verticesStride;
     }
   }
@@ -1175,6 +1175,35 @@ function recursive(points, x1, y1, x2, y2, x3, y3, distanceTolerance, level) {
   recursive(points, x123, y123, x23, y23, x3, y3, distanceTolerance, level + 1);
 }
 
+function getDirectedArea(vertices) {
+  let area = 0;
+  const n = vertices.length;
+  for (let i = 0; i < n; i += 2) {
+    const x0 = vertices[i];
+    const y0 = vertices[i + 1];
+    const x1 = vertices[(i + 2) % (n - 1)];
+    const y1 = vertices[(i + 3) % n];
+    area += x0 * y1 - x1 * y0;
+  }
+  return area / 2;
+}
+
+function pointInPolygon(point, polygon) {
+  let inside = false;
+  const [x, y] = point;
+  const len = polygon.length / 2;
+  for (let i = 0, j = len - 1; i < len; j = i++) {
+    const xi = polygon[i * 2];
+    const yi = polygon[i * 2 + 1];
+    const xj = polygon[j * 2];
+    const yj = polygon[j * 2 + 1];
+    if (yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi) {
+      inside = !inside;
+    }
+  }
+  return inside;
+}
+
 function quadraticBezierP0(t, p) {
   const k = 1 - t;
   return k * k * p;
@@ -1603,7 +1632,7 @@ class Curve {
     });
     return this;
   }
-  getUnevenPointArray(count = 5, output = []) {
+  getUnevenVertices(count = 5, output = []) {
     const p = new Vector2();
     for (let i = 0, len = Math.max(1, count) - 1; i <= len; i++) {
       this.getPoint(i / len, p);
@@ -1611,7 +1640,7 @@ class Curve {
     }
     return output;
   }
-  getSpacedPointArray(count = 5, output = []) {
+  getSpacedVertices(count = 5, output = []) {
     const p = new Vector2();
     for (let i = 0, len = Math.max(1, count) - 1; i <= len; i++) {
       this.getPointAt(i / len, p);
@@ -1619,40 +1648,40 @@ class Curve {
     }
     return output;
   }
-  getAdaptivePointArray(output = []) {
-    return this.getUnevenPointArray(5, output);
+  getAdaptiveVertices(output = []) {
+    return this.getUnevenVertices(5, output);
   }
-  _pointArrayToPoint(array, output = []) {
-    for (let i = 0, len = array.length; i < len; i += 2) {
-      const x = array[i];
-      const y = array[i + 1];
+  _verticesToPoints(vertices, output = []) {
+    for (let i = 0, len = vertices.length; i < len; i += 2) {
+      const x = vertices[i];
+      const y = vertices[i + 1];
       output.push(new Vector2(x, y));
     }
     return output;
   }
   getSpacedPoints(count, output = []) {
-    const array = this.getSpacedPointArray(count);
-    this._pointArrayToPoint(array, output);
+    const array = this.getSpacedVertices(count);
+    this._verticesToPoints(array, output);
     return output;
   }
   getUnevenPoints(count, output = []) {
-    const array = this.getUnevenPointArray(count);
-    this._pointArrayToPoint(array, output);
+    const array = this.getUnevenVertices(count);
+    this._verticesToPoints(array, output);
     return output;
   }
   getAdaptivePoints(output = []) {
-    const array = this.getAdaptivePointArray();
-    this._pointArrayToPoint(array, output);
+    const array = this.getAdaptiveVertices();
+    this._verticesToPoints(array, output);
     return output;
   }
   getPoints(count, output = []) {
     let array;
     if (count) {
-      array = this.getUnevenPointArray(count);
+      array = this.getUnevenVertices(count);
     } else {
-      array = this.getAdaptivePointArray();
+      array = this.getAdaptiveVertices();
     }
-    this._pointArrayToPoint(array, output);
+    this._verticesToPoints(array, output);
     return output;
   }
   getLength() {
@@ -1757,44 +1786,21 @@ class Curve {
     const { min, max } = this.getMinMax();
     return new BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y);
   }
+  getFillVertices(_options) {
+    return this.getAdaptiveVertices();
+  }
   fillTriangulate(options) {
     return fillTriangulate(
-      this.getAdaptivePointArray(),
+      this.getFillVertices(options),
       options
     );
   }
   strokeTriangulate(options) {
     return strokeTriangulate(
-      this.getAdaptivePointArray(),
+      this.getAdaptiveVertices(),
       options
     );
   }
-  toTriangulatedSVGString(result = this.fillTriangulate(), padding = 0) {
-    const { vertices, indices } = result;
-    const min = { x: -padding, y: -padding };
-    const max = { x: padding, y: padding };
-    const getPoint = (indice) => {
-      const x = vertices[indice * 2];
-      const y = vertices[indice * 2 + 1];
-      min.x = Math.min(min.x, x + padding);
-      max.x = Math.max(max.x, x + padding);
-      min.y = Math.min(min.y, y + padding);
-      max.y = Math.max(max.y, y + padding);
-      return [x, y];
-    };
-    let polygonStr = "";
-    for (let i = 0, len = indices.length; i < len; i += 3) {
-      const p1 = getPoint(indices[i]);
-      const p2 = getPoint(indices[i + 1]);
-      const p3 = getPoint(indices[i + 2]);
-      polygonStr += `<polygon points="${p1.join(",")} ${p2.join(",")} ${p3.join(",")}" fill="none" stroke="black" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round" />`;
-    }
-    const viewBox = [min.x, min.y, max.x - min.x, max.y - min.y];
-    return `<svg width="${viewBox[2]}" height="${viewBox[3]}" viewBox="${viewBox.join(" ")}" xmlns="http://www.w3.org/2000/svg">${polygonStr}</svg>`;
-  }
-  toTriangulatedSVG(result, padding) {
-    return new DOMParser().parseFromString(this.toTriangulatedSVGString(result, padding), "image/svg+xml").documentElement;
-  }
   toCommands() {
     const comds = [];
     const potins = this.getPoints();
@@ -1969,69 +1975,114 @@ class RoundCurve extends Curve {
   getControlPointRefs() {
     return [this._center];
   }
-  getAdaptivePointArray(output = []) {
-    const { cx, cy, rx, ry, startAngle, endAngle, clockwise } = this;
-    if (!(rx >= 0 && ry >= 0)) {
+  _getAdaptiveVerticesByArc(output = []) {
+    const { cx, cy, rx, ry, dx, dy, startAngle, endAngle, clockwise: _clockwise } = this;
+    const clockwise = !_clockwise;
+    const x = cx;
+    const y = cy;
+    const start = startAngle;
+    const end = endAngle;
+    let dist = Math.abs(start - end);
+    if (!clockwise && start > end) {
+      dist = 2 * Math.PI - dist;
+    } else if (clockwise && end > start) {
+      dist = 2 * Math.PI - dist;
+    }
+    let steps = Math.max(6, Math.floor(6 * rx ** (1 / 3) * (dist / Math.PI)));
+    steps = Math.max(steps, 3);
+    let f = dist / steps;
+    let t = start;
+    f *= clockwise ? -1 : 1;
+    for (let i = 0; i < steps + 1; i++) {
+      const cs = Math.cos(t);
+      const sn = Math.sin(t);
+      const nx = x + dx + cs * rx;
+      const ny = y + dy + sn * ry;
+      output.push(nx, ny);
+      t += f;
+    }
+    return output;
+  }
+  _getAdaptiveVerticesByCircle(output = []) {
+    const { cx, cy, rx, ry, dx, dy } = this;
+    if (!(rx >= 0 && ry >= 0 && dx >= 0 && dy >= 0)) {
+      return output;
+    }
+    const n = Math.ceil(2.3 * Math.sqrt(rx + ry));
+    const x = cx;
+    const y = cy;
+    const m = n * 8 + (dx ? 4 : 0) + (dy ? 4 : 0);
+    if (m === 0) {
+      return output;
+    }
+    const start = output.length;
+    if (n === 0) {
+      output[start] = output[start + 6] = x + dx;
+      output[start + 1] = output[start + 3] = y + dy;
+      output[start + 2] = output[start + 4] = x - dx;
+      output[start + 5] = output[start + 7] = y - dy;
       return output;
     }
-    let deltaAngle = endAngle - startAngle;
-    if (!clockwise && deltaAngle > 0) {
-      deltaAngle -= 2 * Math.PI;
-    } else if (clockwise && deltaAngle < 0) {
-      deltaAngle += 2 * Math.PI;
-    }
-    const arcLength = Math.abs(deltaAngle);
-    const n = Math.max(1, Math.ceil(arcLength / (Math.PI / 16)));
-    for (let i = 0; i <= n; i++) {
-      const t = i / n;
-      const angle = startAngle + deltaAngle * t;
-      const x = cx + Math.cos(angle) * rx;
-      const y = cy + Math.sin(angle) * ry;
-      output.push(x, y);
+    let j1 = start;
+    let j2 = start + n * 4 + (dx ? 2 : 0) + 2;
+    let j3 = j2;
+    let j4 = m;
+    let x0 = dx + rx;
+    let y0 = dy;
+    let x1 = x + x0;
+    let x2 = x - x0;
+    let y1 = y + y0;
+    output[j1++] = x1;
+    output[j1++] = y1;
+    output[--j2] = y1;
+    output[--j2] = x2;
+    if (dy) {
+      const y22 = y - y0;
+      output[j3++] = x2;
+      output[j3++] = y22;
+      output[--j4] = y22;
+      output[--j4] = x1;
+    }
+    for (let i = 1; i < n; i++) {
+      const a = Math.PI / 2 * (i / n);
+      const x02 = dx + Math.cos(a) * rx;
+      const y02 = dy + Math.sin(a) * ry;
+      const x12 = x + x02;
+      const x22 = x - x02;
+      const y12 = y + y02;
+      const y22 = y - y02;
+      output[j1++] = x12;
+      output[j1++] = y12;
+      output[--j2] = y12;
+      output[--j2] = x22;
+      output[j3++] = x22;
+      output[j3++] = y22;
+      output[--j4] = y22;
+      output[--j4] = x12;
+    }
+    x0 = dx;
+    y0 = dy + ry;
+    x1 = x + x0;
+    x2 = x - x0;
+    y1 = y + y0;
+    const y2 = y - y0;
+    output[j1++] = x1;
+    output[j1++] = y1;
+    output[--j4] = y2;
+    output[--j4] = x1;
+    if (dx) {
+      output[j1++] = x2;
+      output[j1++] = y1;
+      output[--j4] = y2;
+      output[--j4] = x2;
     }
     return output;
   }
-  fillTriangulate(options = {}) {
-    let {
-      vertices = [],
-      indices = [],
-      verticesStride = 2,
-      verticesOffset = vertices.length / verticesStride,
-      indicesOffset = indices.length
-    } = options;
-    const points = this.getAdaptivePointArray();
-    if (points.length === 0) {
-      return { vertices, indices };
-    }
-    let centerX = 0;
-    let centerY = 0;
-    for (let i = 0; i < points.length; i += 2) {
-      centerX += points[i];
-      centerY += points[i + 1];
-    }
-    centerX /= points.length / 2;
-    centerY /= points.length / 2;
-    let count = verticesOffset;
-    vertices[count * verticesStride] = centerX;
-    vertices[count * verticesStride + 1] = centerY;
-    const centerIndex = count++;
-    for (let i = 0; i < points.length; i += 2) {
-      vertices[count * verticesStride] = points[i];
-      vertices[count * verticesStride + 1] = points[i + 1];
-      if (i > 0) {
-        indices[indicesOffset++] = count;
-        indices[indicesOffset++] = centerIndex;
-        indices[indicesOffset++] = count - 1;
-      }
-      count++;
-    }
-    indices[indicesOffset++] = centerIndex + 1;
-    indices[indicesOffset++] = centerIndex;
-    indices[indicesOffset++] = count - 1;
-    return {
-      vertices,
-      indices
-    };
+  getAdaptiveVertices(output = []) {
+    if (this.startAngle === 0 && this.endAngle === Math.PI * 2) {
+      return this._getAdaptiveVerticesByCircle(output);
+    }
+    return this._getAdaptiveVerticesByArc(output);
   }
   getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
     const { cx, cy, rx, ry, rotate } = this;
@@ -2228,7 +2279,7 @@ class ArcCurve extends RoundCurve {
     );
     return this;
   }
-  getAdaptivePointArray(output = []) {
+  getAdaptiveVertices(output = []) {
     const { cx, cy, rx, startAngle, endAngle, clockwise } = this;
     let dist = Math.abs(startAngle - endAngle);
     if (!clockwise && startAngle > endAngle) {
@@ -2253,6 +2304,96 @@ class ArcCurve extends RoundCurve {
   }
 }
 
+class LineCurve extends Curve {
+  constructor(p1 = new Vector2(), p2 = new Vector2()) {
+    super();
+    this.p1 = p1;
+    this.p2 = p2;
+  }
+  static from(p1x, p1y, p2x, p2y) {
+    return new LineCurve(
+      new Vector2(p1x, p1y),
+      new Vector2(p2x, p2y)
+    );
+  }
+  getPoint(t, output = new Vector2()) {
+    if (t === 1) {
+      output.copy(this.p2);
+    } else {
+      output.copy(this.p2).sub(this.p1).scale(t).add(this.p1);
+    }
+    return output;
+  }
+  getPointAt(u, output = new Vector2()) {
+    return this.getPoint(u, output);
+  }
+  getTangent(_t, output = new Vector2()) {
+    return output.subVectors(this.p2, this.p1).normalize();
+  }
+  getTangentAt(u, output = new Vector2()) {
+    return this.getTangent(u, output);
+  }
+  getControlPointRefs() {
+    return [this.p1, this.p2];
+  }
+  getAdaptiveVertices(output = []) {
+    output.push(
+      this.p1.x,
+      this.p1.y,
+      this.p2.x,
+      this.p2.y
+    );
+    return output;
+  }
+  getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
+    const { p1, p2 } = this;
+    min.x = Math.min(min.x, p1.x, p2.x);
+    min.y = Math.min(min.y, p1.y, p2.y);
+    max.x = Math.max(max.x, p1.x, p2.x);
+    max.y = Math.max(max.y, p1.y, p2.y);
+    return { min: min.finite(), max: max.finite() };
+  }
+  toCommands() {
+    const { p1, p2 } = this;
+    return [
+      { type: "M", x: p1.x, y: p1.y },
+      { type: "L", x: p2.x, y: p2.y }
+    ];
+  }
+  getFillVertices(options = {}) {
+    const minX = Math.min(this.p1.x, this.p2.x);
+    const maxX = Math.max(this.p1.x, this.p2.x);
+    const minY = Math.min(this.p1.y, this.p2.y);
+    const maxY = Math.max(this.p1.y, this.p2.y);
+    const x = minX;
+    const y = minY;
+    const width = maxX - minX || options.style?.strokeWidth || 0;
+    const height = maxY - minY || options.style?.strokeWidth || 0;
+    return [
+      x,
+      y,
+      x + width,
+      y,
+      x + width,
+      y + height,
+      x,
+      y + height
+    ];
+  }
+  drawTo(ctx) {
+    const { p1, p2 } = this;
+    ctx.lineTo(p1.x, p1.y);
+    ctx.lineTo(p2.x, p2.y);
+    return this;
+  }
+  copy(source) {
+    super.copy(source);
+    this.p1.copy(source.p1);
+    this.p2.copy(source.p2);
+    return this;
+  }
+}
+
 class CompositeCurve extends Curve {
   constructor(curves = []) {
     super();
@@ -2300,15 +2441,17 @@ class CompositeCurve extends Curve {
     return this.curves.flatMap((curve) => curve.getControlPointRefs());
   }
   _removeNextPointIfEqualPrevPoint(output, offset) {
-    if (output[offset - 1] === output[offset + 1] && output[offset] === output[offset + 2]) {
+    const p1 = [output[offset - 1], output[offset]];
+    const p2 = [output[offset + 1], output[offset + 2]];
+    if (p1[0] === p2[0] && p1[1] === p2[1]) {
       output.splice(offset + 1, 2);
     }
     return output;
   }
-  getSpacedPointArray(count = 5, output = []) {
+  getSpacedVertices(count = 5, output = []) {
     let offset;
     this.curves.forEach((curve) => {
-      curve.getSpacedPointArray(count, output);
+      curve.getSpacedVertices(count, output);
       if (offset) {
         this._removeNextPointIfEqualPrevPoint(output, offset);
       }
@@ -2316,10 +2459,10 @@ class CompositeCurve extends Curve {
     });
     return output;
   }
-  getAdaptivePointArray(output = []) {
+  getAdaptiveVertices(output = []) {
     let offset;
     this.curves.forEach((curve) => {
-      curve.getAdaptivePointArray(output);
+      curve.getAdaptiveVertices(output);
       if (offset) {
         this._removeNextPointIfEqualPrevPoint(output, offset);
       }
@@ -2327,17 +2470,34 @@ class CompositeCurve extends Curve {
     });
     return output;
   }
-  fillTriangulate(options) {
-    const indices = options?.indices ?? [];
-    const vertices = options?.vertices ?? [];
-    this.curves.forEach((curve) => {
-      curve.fillTriangulate({
-        ...options,
-        indices,
-        vertices
+  strokeTriangulate(options) {
+    if (this.curves.length === 1) {
+      return this.curves[0].strokeTriangulate(options);
+    } else {
+      return super.strokeTriangulate(options);
+    }
+  }
+  getFillVertices(options) {
+    if (this.curves.length === 1) {
+      return this.curves[0].getFillVertices(options);
+    } else {
+      const output = [];
+      let offset;
+      this.curves.forEach((curve) => {
+        let arr;
+        if (curve instanceof LineCurve) {
+          arr = curve.getAdaptiveVertices();
+        } else {
+          arr = curve.getFillVertices(options);
+        }
+        output.push(...arr);
+        if (offset) {
+          this._removeNextPointIfEqualPrevPoint(output, offset);
+        }
+        offset = output.length - 1;
       });
-    });
-    return { indices, vertices };
+      return output;
+    }
   }
   applyTransform(transform) {
     this.curves.forEach((curve) => curve.applyTransform(transform));
@@ -2392,7 +2552,7 @@ class CubicBezierCurve extends Curve {
       cubicBezier(t, p1.y, cp1.y, cp2.y, p2.y)
     );
   }
-  getAdaptivePointArray(output = []) {
+  getAdaptiveVertices(output = []) {
     return getAdaptiveCubicBezierCurvePoints(
       this.p1.x,
       this.p1.y,
@@ -2497,125 +2657,6 @@ class EllipseCurve extends RoundCurve {
   }
 }
 
-class LineCurve extends Curve {
-  constructor(p1 = new Vector2(), p2 = new Vector2()) {
-    super();
-    this.p1 = p1;
-    this.p2 = p2;
-  }
-  static from(p1x, p1y, p2x, p2y) {
-    return new LineCurve(
-      new Vector2(p1x, p1y),
-      new Vector2(p2x, p2y)
-    );
-  }
-  getPoint(t, output = new Vector2()) {
-    if (t === 1) {
-      output.copy(this.p2);
-    } else {
-      output.copy(this.p2).sub(this.p1).scale(t).add(this.p1);
-    }
-    return output;
-  }
-  getPointAt(u, output = new Vector2()) {
-    return this.getPoint(u, output);
-  }
-  getTangent(_t, output = new Vector2()) {
-    return output.subVectors(this.p2, this.p1).normalize();
-  }
-  getTangentAt(u, output = new Vector2()) {
-    return this.getTangent(u, output);
-  }
-  getControlPointRefs() {
-    return [this.p1, this.p2];
-  }
-  getAdaptivePointArray(output = []) {
-    output.push(
-      this.p1.x,
-      this.p1.y,
-      this.p2.x,
-      this.p2.y
-    );
-    return output;
-  }
-  getMinMax(min = Vector2.MAX, max = Vector2.MIN) {
-    const { p1, p2 } = this;
-    min.x = Math.min(min.x, p1.x, p2.x);
-    min.y = Math.min(min.y, p1.y, p2.y);
-    max.x = Math.max(max.x, p1.x, p2.x);
-    max.y = Math.max(max.y, p1.y, p2.y);
-    return { min: min.finite(), max: max.finite() };
-  }
-  toCommands() {
-    const { p1, p2 } = this;
-    return [
-      { type: "M", x: p1.x, y: p1.y },
-      { type: "L", x: p2.x, y: p2.y }
-    ];
-  }
-  fillTriangulate(options = {}) {
-    let {
-      vertices = [],
-      indices = [],
-      verticesStride = 2,
-      verticesOffset = vertices.length / verticesStride,
-      indicesOffset = indices.length
-    } = options;
-    const minX = Math.min(this.p1.x, this.p2.x);
-    const maxX = Math.max(this.p1.x, this.p2.x);
-    const minY = Math.min(this.p1.y, this.p2.y);
-    const maxY = Math.max(this.p1.y, this.p2.y);
-    const x = minX;
-    const y = minY;
-    const width = maxX - minX;
-    const height = maxY - minY;
-    const points = [
-      x,
-      y,
-      x + width,
-      y,
-      x + width,
-      y + height,
-      x,
-      y + height
-    ];
-    let count = 0;
-    verticesOffset *= verticesStride;
-    vertices[verticesOffset + count] = points[0];
-    vertices[verticesOffset + count + 1] = points[1];
-    count += verticesStride;
-    vertices[verticesOffset + count] = points[2];
-    vertices[verticesOffset + count + 1] = points[3];
-    count += verticesStride;
-    vertices[verticesOffset + count] = points[6];
-    vertices[verticesOffset + count + 1] = points[7];
-    count += verticesStride;
-    vertices[verticesOffset + count] = points[4];
-    vertices[verticesOffset + count + 1] = points[5];
-    count += verticesStride;
-    const verticesIndex = verticesOffset / verticesStride;
-    indices[indicesOffset++] = verticesIndex;
-    indices[indicesOffset++] = verticesIndex + 1;
-    indices[indicesOffset++] = verticesIndex + 2;
-    indices[indicesOffset++] = verticesIndex + 1;
-    indices[indicesOffset++] = verticesIndex + 3;
-    indices[indicesOffset++] = verticesIndex + 2;
-    return { vertices, indices };
-  }
-  drawTo(ctx) {
-    const { p1, p2 } = this;
-    ctx.lineTo(p1.x, p1.y);
-    ctx.lineTo(p2.x, p2.y);
-    return this;
-  }
-  copy(source) {
-    super.copy(source);
-    this.p1.copy(source.p1);
-    this.p2.copy(source.p2);
-    return this;
-  }
-}
-
 class PloygonCurve extends CompositeCurve {
   //
 }
@@ -2689,7 +2730,7 @@ class QuadraticBezierCurve extends Curve {
   getControlPointRefs() {
     return [this.p1, this.cp, this.p2];
   }
-  getAdaptivePointArray(output = []) {
+  getAdaptiveVertices(output = []) {
     return getAdaptiveQuadraticBezierCurvePoints(
       this.p1.x,
       this.p1.y,
@@ -2764,16 +2805,9 @@ class RectangleCurve extends PloygonCurve {
     ctx.rect(this.x, this.y, this.width, this.height);
     return this;
   }
-  fillTriangulate(options = {}) {
-    let {
-      vertices = [],
-      indices = [],
-      verticesStride = 2,
-      verticesOffset = vertices.length / verticesStride,
-      indicesOffset = indices.length
-    } = options;
+  getFillVertices(_options = {}) {
     const { x, y, width, height } = this;
-    const points = [
+    return [
       x,
       y,
       x + width,
@@ -2783,28 +2817,6 @@ class RectangleCurve extends PloygonCurve {
       x,
       y + height
     ];
-    let count = 0;
-    verticesOffset *= verticesStride;
-    vertices[verticesOffset + count] = points[0];
-    vertices[verticesOffset + count + 1] = points[1];
-    count += verticesStride;
-    vertices[verticesOffset + count] = points[2];
-    vertices[verticesOffset + count + 1] = points[3];
-    count += verticesStride;
-    vertices[verticesOffset + count] = points[6];
-    vertices[verticesOffset + count + 1] = points[7];
-    count += verticesStride;
-    vertices[verticesOffset + count] = points[4];
-    vertices[verticesOffset + count + 1] = points[5];
-    count += verticesStride;
-    const verticesIndex = verticesOffset / verticesStride;
-    indices[indicesOffset++] = verticesIndex;
-    indices[indicesOffset++] = verticesIndex + 1;
-    indices[indicesOffset++] = verticesIndex + 2;
-    indices[indicesOffset++] = verticesIndex + 1;
-    indices[indicesOffset++] = verticesIndex + 3;
-    indices[indicesOffset++] = verticesIndex + 2;
-    return { vertices, indices };
   }
   copy(source) {
     super.copy(source);
@@ -2916,25 +2928,30 @@ class CurvePath extends CompositeCurve {
     this.addCommands(svgPathDataToCommands(data));
     return this;
   }
-  _closePointArray(output) {
+  _closeVertices(output) {
     if (this.autoClose && output.length >= 4 && (output[0] !== output[output.length - 2] && output[1] !== output[output.length - 1])) {
       output.push(output[0], output[1]);
     }
     return output;
   }
-  getUnevenPointArray(count = 40, output = []) {
-    return this._closePointArray(
-      super.getUnevenPointArray(count, output)
+  getUnevenVertices(count = 40, output = []) {
+    return this._closeVertices(
+      super.getUnevenVertices(count, output)
     );
   }
-  getSpacedPointArray(count = 40, output = []) {
-    return this._closePointArray(
-      super.getSpacedPointArray(count, output)
+  getSpacedVertices(count = 40, output = []) {
+    return this._closeVertices(
+      super.getSpacedVertices(count, output)
     );
   }
-  getAdaptivePointArray(output = []) {
-    return this._closePointArray(
-      super.getAdaptivePointArray(output)
+  getAdaptiveVertices(output = []) {
+    return this._closeVertices(
+      super.getAdaptiveVertices(output)
+    );
+  }
+  getFillVertices(options) {
+    return this._closeVertices(
+      super.getFillVertices(options)
     );
   }
   _setCurrentPoint(point) {
@@ -3362,11 +3379,78 @@ class Path2D extends CompositeCurve {
       curve.strokeTriangulate({
         ...options,
         indices,
-        vertices
+        vertices,
+        style: { ...this.style }
       });
     });
     return { indices, vertices };
   }
+  fillTriangulate(options) {
+    const _options = {
+      ...options,
+      style: {
+        ...this.style,
+        ...options?.style
+      }
+    };
+    const indices = _options.indices ?? [];
+    const vertices = _options.vertices ?? [];
+    const fillRule = _options.style.fillRule ?? "nonzero";
+    if (fillRule === "nonzero") {
+      const pointArrays = this.curves.map((curve) => curve.getFillVertices(_options));
+      const parentMap = /* @__PURE__ */ new Map();
+      const parentd = /* @__PURE__ */ new Set();
+      for (let i = 0; i < pointArrays.length; i++) {
+        const parents = [];
+        for (let j = 0; j < pointArrays.length; j++) {
+          if (i === j)
+            continue;
+          if (pointInPolygon([pointArrays[i][0], pointArrays[i][1]], pointArrays[j])) {
+            parents.push(j);
+          }
+        }
+        if (parents.length) {
+          parents.forEach((pi) => {
+            let set = parentMap.get(pi);
+            if (!set) {
+              set = /* @__PURE__ */ new Set();
+              parentMap.set(pi, set);
+            }
+            set.add(i);
+          });
+          parentd.add(i);
+        }
+      }
+      pointArrays.forEach((pointArray, i) => {
+        if (parentd.has(i) || !pointArray.length) {
+          return;
+        }
+        const _pointArray = pointArray.slice();
+        const holes = [];
+        parentMap.get(i)?.forEach((ci) => {
+          holes.push(_pointArray.length / 2);
+          _pointArray.push(...pointArrays[ci]);
+        });
+        fillTriangulate(_pointArray, {
+          ...options,
+          indices,
+          vertices,
+          holes,
+          style: { ...this.style }
+        });
+      });
+    } else {
+      this.curves.forEach((curve) => {
+        curve.fillTriangulate({
+          ...options,
+          indices,
+          vertices,
+          style: { ...this.style }
+        });
+      });
+    }
+    return { indices, vertices };
+  }
   getBoundingBox(withStyle = true) {
     const { min, max } = this.getMinMax(undefined, undefined, withStyle);
     return new BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y);
@@ -3458,6 +3542,34 @@ class Path2DSet {
     this.paths.forEach((path) => path.getMinMax(min, max, withStyle));
     return new BoundingBox(min.x, min.y, max.x - min.x, max.y - min.y);
   }
+  toTriangulatedSVGString(result = this.paths.map((p) => p.fillTriangulate()), padding = 0) {
+    let polygonStr = "";
+    const min = { x: -padding, y: -padding };
+    const max = { x: padding, y: padding };
+    const results = Array.isArray(result) ? result : [result];
+    results.forEach(({ vertices, indices }) => {
+      const getPoint = (indice) => {
+        const x = vertices[indice * 2];
+        const y = vertices[indice * 2 + 1];
+        min.x = Math.min(min.x, x + padding);
+        max.x = Math.max(max.x, x + padding);
+        min.y = Math.min(min.y, y + padding);
+        max.y = Math.max(max.y, y + padding);
+        return [x, y];
+      };
+      for (let i = 0, len = indices.length; i < len; i += 3) {
+        const p1 = getPoint(indices[i]);
+        const p2 = getPoint(indices[i + 1]);
+        const p3 = getPoint(indices[i + 2]);
+        polygonStr += `<polygon points="${p1.join(",")} ${p2.join(",")} ${p3.join(",")}" fill="black" />`;
+      }
+    });
+    const viewBox = [min.x, min.y, max.x - min.x, max.y - min.y];
+    return `<svg width="${viewBox[2]}" height="${viewBox[3]}" viewBox="${viewBox.join(" ")}" xmlns="http://www.w3.org/2000/svg">${polygonStr}</svg>`;
+  }
+  toTriangulatedSVG(result, padding) {
+    return new DOMParser().parseFromString(this.toTriangulatedSVGString(result, padding), "image/svg+xml").documentElement;
+  }
   toSVGString() {
     const { x, y, width, height } = this.getBoundingBox();
     const content = this.paths.map((path) => path.toSVGPathString()).join("");
@@ -4073,4 +4185,4 @@ function svgToPath2DSet(svg) {
   );
 }
 
-export { ArcCurve, BoundingBox, CompositeCurve, CubicBezierCurve, Curve, CurvePath, EllipseCurve, EquilateralPloygonCurve, FFDControlGrid, LineCurve, Matrix3, Path2D, Path2DSet, PloygonCurve, QuadraticBezierCurve, RectangleCurve, RoundRectangleCurve, SplineCurve, Vector2, applyFFD, catmullRom, cubicBezier, drawPoint, fillTriangulate, getAdaptiveCubicBezierCurvePoints, getAdaptiveQuadraticBezierCurvePoints, parseArcCommand, parsePathDataArgs, quadraticBezier, setCanvasContext, strokeTriangulate, svgPathCommandsAddToPath2D, svgPathCommandsToData, svgPathDataToCommands, svgToDOM, svgToPath2DSet };
+export { ArcCurve, BoundingBox, CompositeCurve, CubicBezierCurve, Curve, CurvePath, EllipseCurve, EquilateralPloygonCurve, FFDControlGrid, LineCurve, Matrix3, Path2D, Path2DSet, PloygonCurve, QuadraticBezierCurve, RectangleCurve, RoundRectangleCurve, SplineCurve, Vector2, applyFFD, catmullRom, cubicBezier, drawPoint, fillTriangulate, getAdaptiveCubicBezierCurvePoints, getAdaptiveQuadraticBezierCurvePoints, getDirectedArea, parseArcCommand, parsePathDataArgs, pointInPolygon, quadraticBezier, setCanvasContext, strokeTriangulate, svgPathCommandsAddToPath2D, svgPathCommandsToData, svgPathDataToCommands, svgToDOM, svgToPath2DSet };