@sliiu/present-three-bake 0.0.0-stage → 0.1.1

package/dist/cjs/light-rig.js

@@ -0,0 +1,162 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.applyLightRig = applyLightRig;
+const THREE = __importStar(require("three"));
+const RIG_PRESETS = {
+    threePt: {
+        ambient: 0.3,
+        lights: [
+            { color: 0xffffff, intensity: 0.9, pos: [3, 4, 5] },
+            { color: 0xffffff, intensity: 0.45, pos: [-4, 2, 3] },
+            { color: 0xffffff, intensity: 0.25, pos: [0, -4, -3] },
+        ],
+    },
+    balanced: {
+        ambient: 0.45,
+        lights: [
+            { color: 0xffffff, intensity: 0.7, pos: [3, 3, 4] },
+            { color: 0xffffff, intensity: 0.5, pos: [-3, 3, 4] },
+        ],
+    },
+    soft: {
+        ambient: 0.55,
+        lights: [{ color: 0xffffff, intensity: 0.55, pos: [2, 4, 4] }],
+    },
+    harsh: {
+        ambient: 0.15,
+        lights: [{ color: 0xffffff, intensity: 1.4, pos: [4, 6, 4] }],
+    },
+    flood: {
+        ambient: 0.65,
+        lights: [
+            { color: 0xffffff, intensity: 0.4, pos: [3, 0, 5] },
+            { color: 0xffffff, intensity: 0.4, pos: [-3, 0, 5] },
+        ],
+    },
+    sunset: {
+        ambient: 0.3,
+        lights: [
+            { color: 0xffd9a8, intensity: 1.0, pos: [4, 2, 3] },
+            { color: 0x6a8fa6, intensity: 0.3, pos: [-3, 3, 4] },
+        ],
+    },
+    morning: {
+        ambient: 0.4,
+        lights: [
+            { color: 0xfff1d6, intensity: 0.85, pos: [3, 5, 4] },
+            { color: 0xffffff, intensity: 0.3, pos: [-3, 2, 2] },
+        ],
+    },
+    freezing: {
+        ambient: 0.4,
+        lights: [
+            { color: 0xd6e7ff, intensity: 0.9, pos: [3, 4, 4] },
+            { color: 0xffffff, intensity: 0.4, pos: [-3, 2, 3] },
+        ],
+    },
+    flat: {
+        ambient: 0.85,
+        lights: [{ color: 0xffffff, intensity: 0.2, pos: [0, 0, 5] }],
+    },
+    twoPt: {
+        ambient: 0.3,
+        lights: [
+            { color: 0xffffff, intensity: 0.8, pos: [4, 3, 4] },
+            { color: 0xffffff, intensity: 0.4, pos: [-4, -1, 3] },
+        ],
+    },
+    glow: {
+        ambient: 0.8,
+        lights: [{ color: 0xfff8d0, intensity: 0.4, pos: [0, 0, 6] }],
+    },
+    brightRoom: {
+        ambient: 0.7,
+        lights: [{ color: 0xffffff, intensity: 0.45, pos: [3, 4, 4] }],
+    },
+    chilly: {
+        ambient: 0.35,
+        lights: [
+            { color: 0xb8d0ff, intensity: 0.9, pos: [3, 3, 4] },
+            { color: 0xffffff, intensity: 0.3, pos: [-3, 1, 2] },
+        ],
+    },
+    contrasting: {
+        ambient: 0.2,
+        lights: [
+            { color: 0xffffff, intensity: 1.2, pos: [4, 5, 4] },
+            { color: 0x000000, intensity: 0, pos: [0, 0, 0] },
+        ],
+    },
+};
+function applyLightRig(scene, rigName, dir) {
+    const spec = RIG_PRESETS[rigName ?? "threePt"] ?? RIG_PRESETS.threePt;
+    const amb = new THREE.AmbientLight(0xffffff, spec.ambient);
+    scene.add(amb);
+    const yaw = dirToYaw(dir);
+    for (const l of spec.lights) {
+        const light = new THREE.DirectionalLight(l.color, l.intensity);
+        const [x, y, z] = rotateXZ(l.pos, yaw);
+        light.position.set(x, y, z);
+        scene.add(light);
+    }
+}
+function dirToYaw(dir) {
+    switch (dir) {
+        case "t":
+            return 0;
+        case "tr":
+            return Math.PI / 4;
+        case "r":
+            return Math.PI / 2;
+        case "br":
+            return (3 * Math.PI) / 4;
+        case "b":
+            return Math.PI;
+        case "bl":
+            return -3 * Math.PI / 4;
+        case "l":
+            return -Math.PI / 2;
+        case "tl":
+            return -Math.PI / 4;
+        default:
+            return 0;
+    }
+}
+function rotateXZ(p, yaw) {
+    const cos = Math.cos(yaw);
+    const sin = Math.sin(yaw);
+    return [p[0] * cos - p[2] * sin, p[1], p[0] * sin + p[2] * cos];
+}

package/dist/cjs/material.js

@@ -0,0 +1,136 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pickPrimaryColor = pickPrimaryColor;
+exports.buildMaterial = buildMaterial;
+exports.applyTextureCrop = applyTextureCrop;
+const THREE = __importStar(require("three"));
+const MATERIAL_PRESETS = {
+    legacyMatte: { metalness: 0, roughness: 1 },
+    legacyPlastic: { metalness: 0, roughness: 0.4 },
+    legacyMetal: { metalness: 0.9, roughness: 0.35 },
+    legacyWireframe: { metalness: 0, roughness: 1 },
+    matte: { metalness: 0, roughness: 0.95 },
+    plastic: { metalness: 0, roughness: 0.35 },
+    metal: { metalness: 0.85, roughness: 0.3 },
+    warmMatte: { metalness: 0, roughness: 0.95 },
+    translucentPowder: { metalness: 0, roughness: 0.6 },
+    powder: { metalness: 0, roughness: 0.8 },
+    dkEdge: { metalness: 0, roughness: 0.6 },
+    softEdge: { metalness: 0, roughness: 0.5 },
+    clear: { metalness: 0, roughness: 0.05, clearcoat: 1 },
+    flat: { metalness: 0, roughness: 1 },
+    softmetal: { metalness: 0.6, roughness: 0.5 },
+};
+function pickPrimaryColor(paint, fallback) {
+    if (!paint)
+        return fallback;
+    if (paint.kind === "solid")
+        return paint.color;
+    if (paint.kind === "linear" || paint.kind === "radial") {
+        const stops = paint.stops;
+        if (stops.length === 0)
+            return fallback;
+        const mid = stops[Math.floor(stops.length / 2)];
+        return mid?.color ?? stops[0]?.color ?? fallback;
+    }
+    return fallback;
+}
+function buildMaterial(paint, opts = {}) {
+    const fallback = opts.fallbackColor ?? "#7f7f7f";
+    const color = pickPrimaryColor(paint, fallback);
+    // ECMA-376 §20.1.5.12 sp3d/@prstMaterial 默认是 `warmMatte` —— 缺省 prstMaterial
+    // 时之前回落到 `plastic`，体高光太亮，看起来像塑料板而不是 PPT 默认的暖哑光纸/卡片
+    // 质感（用户在 WPS 里看到 "材料：暖色粗糙" = warmMatte）。
+    const preset = MATERIAL_PRESETS[opts.prst ?? "warmMatte"] ?? MATERIAL_PRESETS.warmMatte;
+    const useTexture = !!opts.imageTexture;
+    // image 贴图：lighting 有时会把 hi-contrast 黑白图（比如棋盘）压成灰白灰黑——
+    // PBR diffuse 永远把入射光按 albedo/π 漫反射回去，多光源叠加之后白只能勉强达
+    // 1.0、黑被 ambient 提到非零灰。视觉上的"暖色卡片纸 + 倒角高光"在没有 texture
+    // 的纯色面上才有用，有 texture 时 PowerPoint / WPS 表现是"贴图原色直接透出，
+    // 仅做轻微 shading"。
+    // → 有 texture 时切到 MeshBasicMaterial：完全不参与 lighting，texture 像素直
+    // 接 round-trip 出去，再配合 Three.js outputColorSpace=SRGB 就能 1:1 还原原图
+    // 的黑白对比度。lightRig 仍会落到几何，但只通过倒角/侧面（无贴图区）产生明暗
+    // 差，用户感知就是"贴图清晰 + 边缘有 3D 立体感"。
+    if (useTexture) {
+        if (opts.litTexture) {
+            // 折边 / 侧壁：贴图照常透出，但走 PBR 受光 + tint 压暗——正面（basic、满亮）与
+            // 折边之间形成稳定可辨的明暗折痕，区分「上面 / 前面」。roughness 取 1 让过渡柔和。
+            return new THREE.MeshStandardMaterial({
+                color: opts.tint ?? 0xffffff,
+                side: THREE.DoubleSide,
+                map: opts.imageTexture ?? null,
+                metalness: 0,
+                roughness: 1,
+            });
+        }
+        return new THREE.MeshBasicMaterial({
+            color: opts.tint ?? 0xffffff,
+            side: THREE.DoubleSide,
+            map: opts.imageTexture ?? null,
+        });
+    }
+    if (preset.clearcoat !== undefined) {
+        const m = new THREE.MeshPhysicalMaterial({
+            color,
+            metalness: preset.metalness,
+            roughness: preset.roughness,
+            clearcoat: preset.clearcoat,
+            side: THREE.DoubleSide,
+        });
+        return m;
+    }
+    const m = new THREE.MeshStandardMaterial({
+        color,
+        metalness: preset.metalness,
+        roughness: preset.roughness,
+        side: THREE.DoubleSide,
+    });
+    return m;
+}
+// `<a:blip>` 上的 srcRect 把 0..1 的图像截到 (l, t, 1-r, 1-b) 区域。three.js
+// 直接拿原图 + 调整 texture.offset / repeat 就等价裁剪——比预先把 imageData
+// 切片成新 PNG 省一次 putImageData。
+function applyTextureCrop(texture, cropRect) {
+    if (!cropRect)
+        return;
+    const { l, t, r, b } = cropRect;
+    const w = Math.max(1e-6, 1 - l - r);
+    const h = Math.max(1e-6, 1 - t - b);
+    texture.offset.set(l, b);
+    texture.repeat.set(w, h);
+    texture.needsUpdate = true;
+}

package/dist/cjs/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/dist/cjs/path-to-shape.js

@@ -0,0 +1,331 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pathDToShapes = pathDToShapes;
+const THREE = __importStar(require("three"));
+function pathDToShapes(d) {
+    const out = [];
+    let current = null;
+    let x = 0;
+    let y = 0;
+    let startX = 0;
+    let startY = 0;
+    let cpx = 0;
+    let cpy = 0;
+    let lastCmd = "";
+    const minMax = { minX: Infinity, minY: Infinity, maxX: -Infinity, maxY: -Infinity };
+    const track = (px, py) => {
+        if (px < minMax.minX)
+            minMax.minX = px;
+        if (py < minMax.minY)
+            minMax.minY = py;
+        if (px > minMax.maxX)
+            minMax.maxX = px;
+        if (py > minMax.maxY)
+            minMax.maxY = py;
+    };
+    const tokens = tokenizePath(d);
+    let i = 0;
+    while (i < tokens.length) {
+        const t = tokens[i++];
+        if (typeof t !== "string")
+            continue;
+        const cmd = t;
+        const lower = cmd.toLowerCase();
+        const isRel = cmd !== cmd.toUpperCase();
+        const read = () => {
+            const v = tokens[i++];
+            return typeof v === "number" ? v : 0;
+        };
+        if (lower === "m") {
+            const nx = read() + (isRel ? x : 0);
+            const ny = read() + (isRel ? y : 0);
+            if (current)
+                out.push(current);
+            current = new THREE.Shape();
+            current.moveTo(nx, ny);
+            x = nx;
+            y = ny;
+            startX = nx;
+            startY = ny;
+            track(x, y);
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const lx = read() + (isRel ? x : 0);
+                const ly = read() + (isRel ? y : 0);
+                current.lineTo(lx, ly);
+                x = lx;
+                y = ly;
+                track(x, y);
+            }
+        }
+        else if (lower === "l") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const lx = read() + (isRel ? x : 0);
+                const ly = read() + (isRel ? y : 0);
+                current?.lineTo(lx, ly);
+                x = lx;
+                y = ly;
+                track(x, y);
+            }
+        }
+        else if (lower === "h") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const lx = read() + (isRel ? x : 0);
+                current?.lineTo(lx, y);
+                x = lx;
+                track(x, y);
+            }
+        }
+        else if (lower === "v") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const ly = read() + (isRel ? y : 0);
+                current?.lineTo(x, ly);
+                y = ly;
+                track(x, y);
+            }
+        }
+        else if (lower === "c") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const c1x = read() + (isRel ? x : 0);
+                const c1y = read() + (isRel ? y : 0);
+                const c2x = read() + (isRel ? x : 0);
+                const c2y = read() + (isRel ? y : 0);
+                const ex = read() + (isRel ? x : 0);
+                const ey = read() + (isRel ? y : 0);
+                current?.bezierCurveTo(c1x, c1y, c2x, c2y, ex, ey);
+                cpx = c2x;
+                cpy = c2y;
+                x = ex;
+                y = ey;
+                track(x, y);
+            }
+        }
+        else if (lower === "s") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const c1x = lastCmd === "c" || lastCmd === "s" ? 2 * x - cpx : x;
+                const c1y = lastCmd === "c" || lastCmd === "s" ? 2 * y - cpy : y;
+                const c2x = read() + (isRel ? x : 0);
+                const c2y = read() + (isRel ? y : 0);
+                const ex = read() + (isRel ? x : 0);
+                const ey = read() + (isRel ? y : 0);
+                current?.bezierCurveTo(c1x, c1y, c2x, c2y, ex, ey);
+                cpx = c2x;
+                cpy = c2y;
+                x = ex;
+                y = ey;
+                track(x, y);
+            }
+        }
+        else if (lower === "q") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const c1x = read() + (isRel ? x : 0);
+                const c1y = read() + (isRel ? y : 0);
+                const ex = read() + (isRel ? x : 0);
+                const ey = read() + (isRel ? y : 0);
+                current?.quadraticCurveTo(c1x, c1y, ex, ey);
+                cpx = c1x;
+                cpy = c1y;
+                x = ex;
+                y = ey;
+                track(x, y);
+            }
+        }
+        else if (lower === "t") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const c1x = lastCmd === "q" || lastCmd === "t" ? 2 * x - cpx : x;
+                const c1y = lastCmd === "q" || lastCmd === "t" ? 2 * y - cpy : y;
+                const ex = read() + (isRel ? x : 0);
+                const ey = read() + (isRel ? y : 0);
+                current?.quadraticCurveTo(c1x, c1y, ex, ey);
+                cpx = c1x;
+                cpy = c1y;
+                x = ex;
+                y = ey;
+                track(x, y);
+            }
+        }
+        else if (lower === "a") {
+            while (i < tokens.length && typeof tokens[i] === "number") {
+                const rx = Math.abs(read());
+                const ry = Math.abs(read());
+                const phi = read();
+                const large = read();
+                const sweep = read();
+                const ex = read() + (isRel ? x : 0);
+                const ey = read() + (isRel ? y : 0);
+                const curves = svgArcToCubics(x, y, rx, ry, phi, large, sweep, ex, ey);
+                if (!current || curves.length === 0) {
+                    current?.lineTo(ex, ey);
+                }
+                else {
+                    for (const [c1x, c1y, c2x, c2y, px, py] of curves) {
+                        current.bezierCurveTo(c1x, c1y, c2x, c2y, px, py);
+                        track(c1x, c1y);
+                        track(c2x, c2y);
+                        track(px, py);
+                    }
+                }
+                x = ex;
+                y = ey;
+                track(x, y);
+                cpx = x;
+                cpy = y;
+            }
+        }
+        else if (lower === "z") {
+            current?.lineTo(startX, startY);
+            x = startX;
+            y = startY;
+        }
+        lastCmd = lower;
+    }
+    if (current)
+        out.push(current);
+    if (!Number.isFinite(minMax.minX)) {
+        minMax.minX = 0;
+        minMax.minY = 0;
+        minMax.maxX = 0;
+        minMax.maxY = 0;
+    }
+    return {
+        shapes: out,
+        bbox: minMax,
+    };
+}
+function tokenizePath(d) {
+    const out = [];
+    let i = 0;
+    while (i < d.length) {
+        const c = d[i];
+        if (/[a-zA-Z]/.test(c)) {
+            out.push(c);
+            i++;
+        }
+        else if (/[\s,]/.test(c)) {
+            i++;
+        }
+        else if (c === "-" || c === "+" || c === "." || /\d/.test(c)) {
+            let j = i;
+            if (d[j] === "-" || d[j] === "+")
+                j++;
+            while (j < d.length && /[0-9.]/.test(d[j]))
+                j++;
+            if (d[j] === "e" || d[j] === "E") {
+                j++;
+                if (d[j] === "-" || d[j] === "+")
+                    j++;
+                while (j < d.length && /\d/.test(d[j]))
+                    j++;
+            }
+            const num = Number(d.slice(i, j));
+            if (Number.isFinite(num))
+                out.push(num);
+            i = j > i ? j : i + 1;
+        }
+        else {
+            i++;
+        }
+    }
+    return out;
+}
+// SVG arc → 三次贝塞尔。端点参数按 SVG 1.1 附录 F.6 转成圆心，再按不超过 90° 分段。
+function svgArcToCubics(x1, y1, rx, ry, phiDeg, large, sweep, x2, y2) {
+    if (rx === 0 || ry === 0)
+        return [];
+    if (x1 === x2 && y1 === y2)
+        return [];
+    const phi = (phiDeg * Math.PI) / 180;
+    const sinphi = Math.sin(phi);
+    const cosphi = Math.cos(phi);
+    const dx = (x1 - x2) / 2;
+    const dy = (y1 - y2) / 2;
+    const px = cosphi * dx + sinphi * dy;
+    const py = -sinphi * dx + cosphi * dy;
+    rx = Math.abs(rx);
+    ry = Math.abs(ry);
+    const px2 = px * px;
+    const py2 = py * py;
+    let rx2 = rx * rx;
+    let ry2 = ry * ry;
+    const lam = px2 / rx2 + py2 / ry2;
+    if (lam > 1) {
+        const s = Math.sqrt(lam);
+        rx *= s;
+        ry *= s;
+        rx2 = rx * rx;
+        ry2 = ry * ry;
+    }
+    const sign = large === sweep ? -1 : 1;
+    let sq = (rx2 * ry2 - rx2 * py2 - ry2 * px2) / (rx2 * py2 + ry2 * px2);
+    if (!Number.isFinite(sq) || sq < 0)
+        sq = 0;
+    const coef = sign * Math.sqrt(sq);
+    const cxp = (coef * rx * py) / ry;
+    const cyp = (coef * -ry * px) / rx;
+    const cx = cosphi * cxp - sinphi * cyp + (x1 + x2) / 2;
+    const cy = sinphi * cxp + cosphi * cyp + (y1 + y2) / 2;
+    const theta1 = vectorAngle(1, 0, (px - cxp) / rx, (py - cyp) / ry);
+    let dtheta = vectorAngle((px - cxp) / rx, (py - cyp) / ry, (-px - cxp) / rx, (-py - cyp) / ry);
+    if (!sweep && dtheta > 0)
+        dtheta -= Math.PI * 2;
+    if (sweep && dtheta < 0)
+        dtheta += Math.PI * 2;
+    const segs = Math.max(1, Math.ceil(Math.abs(dtheta) / (Math.PI / 2)));
+    const delta = dtheta / segs;
+    const t = (4 / 3) * Math.tan(delta / 4);
+    const out = [];
+    const map = (lx, ly) => [
+        cosphi * lx - sinphi * ly + cx,
+        sinphi * lx + cosphi * ly + cy,
+    ];
+    for (let i = 0; i < segs; i++) {
+        const th = theta1 + i * delta;
+        const th2 = th + delta;
+        const cosTh = Math.cos(th);
+        const sinTh = Math.sin(th);
+        const cosTh2 = Math.cos(th2);
+        const sinTh2 = Math.sin(th2);
+        const p1 = map(rx * (cosTh - t * sinTh), ry * (sinTh + t * cosTh));
+        const p2 = map(rx * (cosTh2 + t * sinTh2), ry * (sinTh2 - t * cosTh2));
+        const end = map(rx * cosTh2, ry * sinTh2);
+        out.push([p1[0], p1[1], p2[0], p2[1], end[0], end[1]]);
+    }
+    return out;
+}
+function vectorAngle(ux, uy, vx, vy) {
+    const dot = ux * vx + uy * vy;
+    const det = ux * vy - uy * vx;
+    return Math.atan2(det, dot);
+}