svg-path-simplify 0.4.4 → 0.4.6

package/src/svgii/poly_analyze_cleanup.js

@@ -0,0 +1,311 @@
+import { rad2Deg } from "../constants";
+import { checkLineIntersection, getAngleFromDelta, getDistManhattan, interpolate } from "./geometry";
+import { getPolygonArea } from "./geometry_area";
+import { getPolyBBox } from "./geometry_bbox";
+import { renderPoint, renderPoly } from "./visualize";
+
+export function refineAdjacentPolyExtremes(pts = []) {
+
+    let l = pts.length;
+
+    let { x, y, width, height, top, bottom, left, right } = getPolyBBox(pts);
+    let threshShort = (width + height) * 0.05;
+    let thresh = (width + height) * 0.001;
+
+    let pt0 = pts[0];
+    let ptLast = pts[l - 1];
+
+
+    /**
+     * cleanup close path - almost vertical or horizontal
+     * average  start and end extremes
+     */
+    let dx = Math.abs(ptLast.x - pt0.x)
+    let dy = Math.abs(ptLast.y - pt0.y)
+
+    if (dy < threshShort || dx < threshShort) {
+
+        if (pt0.isExtreme && !pt0.isCorner) {
+
+            let xAv = (pt0.x + ptLast.x) * 0.5
+            let yAv = (pt0.y + ptLast.y) * 0.5
+
+            pt0.x = xAv
+            pt0.y = yAv
+
+            ptLast.x = xAv
+            ptLast.y = yAv
+            ptLast.isExtreme = true;
+
+
+            if (dy < thresh) {
+                ptLast.tangentR.y = pt0.y
+                ptLast.tangentL.y = pt0.y
+
+            }
+            if (dx < thresh) {
+                ptLast.tangentR.x = pt0.x
+                ptLast.tangentL.x = pt0.x
+            }
+        }
+    }
+
+
+    for (let i = 1; i < l; i++) {
+        let p0 = i > 0 ? pts[i - 1] : pts[l - 1];
+        let p1 = pts[i];
+        let p2 = i < l - 1 ? pts[i + 1] : pts[l - 1];
+        let dist = getDistManhattan(p1, p2)
+
+
+        let { isHorizontal, isVertical, isCorner, isLong, isExtreme, isSemiExtreme, isDirChange } = p1
+        let offset = 0;
+
+        let extremes = []
+
+        /*
+        if(isExtreme && p0.isCorner && !isLong && !isCorner){
+            isExtreme= false
+            p1.isExtreme = false
+            p1.isHorizontal = false
+            p1.isVertical = false
+
+            continue;
+        }
+        */
+
+
+        /*
+        if(isExtreme && p2.isCorner && !isLong && !isCorner && dist<threshShort*0.5){
+            isExtreme= false
+            p1.isExtreme = false
+            p1.isHorizontal = false
+            p1.isVertical = false
+
+            if(isVertical){
+                p2.tangentL.x = p2.x
+            }
+            if(isHorizontal){
+                p2.tangentL.y = p2.y
+            }
+            continue;
+        }
+        */
+
+
+        if (isExtreme && !isCorner && p2.isExtreme) {
+            extremes.push(p1);
+
+            for (let j = i + 1; j < l; j++) {
+                let p2 = pts[j]
+                dist = getDistManhattan(p1, p2)
+
+                if (dist * 0.75 >= threshShort || p2.isCorner || p2.isDirChange) {
+                    break
+                }
+                if (p2.isExtreme && !p2.isDirChange && !p2.isCorner) {
+                    extremes.push(p2);
+                }
+            }
+
+            //extremes = []
+            if (extremes.length > 1) {
+
+                //let ptPrev = pts[i - 2]
+                //let ptNext = pts[i + extremes.length]
+
+                //renderPoint(markers, ptPrev, 'orange', '2%')
+                //renderPoint(markers, ptNext, 'orange', '2%')
+
+                //let lenEx = extremes.length
+                //let idxM = Math.ceil(lenEx * 0.5)
+                //let extremeMid = extremes[idxM]
+
+                // find best extreme according to angle
+                let angleDiffMin = Infinity;
+                //let bestMatch = extremes[Math.floor(extremes.length*0.5)];
+                let bestMatch = extremes[0];
+
+                
+                extremes.forEach(pt => {
+                    //renderPoint(markers, pt, 'red', '3%')
+                    let angle = Math.abs(getAngleFromDelta(pt.dx2, pt.dy2, false)) * rad2Deg
+                    let angleDiff = angle > 160 ? Math.abs(180 - angle) : (angle > 60 ? Math.abs(90 - angle) : angle)
+                    pt.angle = angle;
+                    pt.angleDiff = angleDiff;
+
+                    if (angleDiff < angleDiffMin) {
+                        bestMatch = pt;
+                        angleDiffMin = angleDiff
+                        //if(!angleDiff) matches.push(pt)
+
+                    }
+                })
+
+                //renderPoint(markers, bestMatch, 'red', '4.5%', '0.5')
+                //renderPoint(markers, bestMatch, 'blue', '4.5%', '0.5')
+
+
+                //console.log('matches', bestMatch, extremes);
+
+                let extremes2 = []
+
+                extremes.forEach((pt, i) => {
+
+                    //let isBestMatch = pt.x === bestMatch.x && pt.y === bestMatch.y;
+                    let isBestMatch = pt === bestMatch;
+                    //renderPoint(markers, bestMatch, 'blue', '4.5%', '0.5')
+
+                    if (isBestMatch) {
+                        //extremes2.push(pt)
+                        //renderPoint(markers, pt, 'red', '4.5%', '0.5')
+
+                        if (pt.isHorizontal) {
+                            pt.tangentL.y = pt.y
+                            pt.tangentR.y = pt.y
+                        }
+                        if (pt.isVertical) {
+                            pt.tangentL.x = pt.x
+                            pt.tangentR.x = pt.x
+                        }
+                        //renderPoint(markers, extremes[0], 'brown', '2.5%', '0.5')
+                        //renderPoint(markers, extremes[extremes.length - 1], 'magenta', '2.5%', '0.5')
+                        // renderPoint(markers, pt, 'green', '3%', '0.5')
+
+                    }
+                    else {
+
+
+                        //console.log('bestMatch', bestMatch);
+                        //renderPoint(markers, pt, 'blue', '4.5%', '0.5')
+
+
+                        if (bestMatch) {
+
+                            if (!isBestMatch && (pt.x === bestMatch.x || pt.y === bestMatch.y)) {
+                                extremes2.push(pt)
+                            }
+                            pt.isExtreme = false
+                            pt.isHorizontal = false
+                            pt.isVertical = false
+                        }
+
+
+                    }
+
+                })
+
+                // average coordinates
+                if (extremes2.length) {
+                    bestMatch.x = (extremes2[0].x + bestMatch.x) * 0.5
+                    bestMatch.y = (extremes2[0].y + bestMatch.y) * 0.5
+                    //pts.splice(extremes2[0].idx, 1)
+                }
+
+                //console.log('extremes2', extremes2);
+                i += extremes.length
+                continue;
+            }
+        }
+
+    }
+
+}
+
+export function cleanupPolyKeypoints(pts = []) {
+
+    let l = pts.length;
+
+    let { x, y, width, height, top, bottom, left, right } = getPolyBBox(pts);
+    //let thresh0 = (width + height) * 0.025;
+    let thresh = (width + height) * 0.001;
+
+    let pt0 = pts[0];
+    //let ptLast = pts[l - 1];
+    let ptsClean = [pt0];
+
+    //renderPoint(markers, ptLast)
+
+    for (let i = 1; i < l; i++) {
+        let p0 = i > 0 ? pts[i - 1] : pts[l - 1];
+        let p1 = pts[i];
+        let p2 = i < l - 1 ? pts[i + 1] : pts[l - 1];
+
+        let { isHorizontal, isVertical, isCorner, isLong, isExtreme, isSemiExtreme, isDirChange } = p1
+        let offset = 0;
+
+        if (!isSemiExtreme){
+            //ptsClean.push(p1, p2)
+            continue
+        }
+
+        if (isSemiExtreme || isExtreme) {
+            let semiExtremes = isSemiExtreme ? [p1] : [];
+            let extremes = isExtreme ? [p1] : [];
+
+            for (let j = i + 1; j < l; j++) {
+                let p2 = pts[j]
+
+                if (!p2.isSemiExtreme || p2.isExtreme || p2.isCorner){
+                    break
+                }
+                semiExtremes.push(p2)
+            }
+
+            if (semiExtremes.length > 1) {
+
+                //interpolate
+                let semiExtremeMid = semiExtremes[Math.floor(semiExtremes.length*0.5)]
+                let p1_1 = semiExtremes[0]
+                let p2_1 = semiExtremes[semiExtremes.length - 1]
+                let ptI = checkLineIntersection(p1_1, p1_1.tangentR, p2_1, p2_1.tangentL, false, true)
+                //console.log(ptI);
+                //console.log('tangents', p1_1, p1_1.tangentR,  p2_1, p2_1.tangentL);
+
+                //renderPoly(markers, [p1_1, p1_1.tangentR], 'red', '2%')
+                semiExtremes.forEach(pt=>{
+                    pt.isSemiExtreme=false
+                })
+                semiExtremeMid.isSemiExtreme=true;
+
+                // interpolate mid point
+                if (ptI) {
+                    let pI_1 = interpolate(p1_1, ptI, 0.5)
+                    let pI_2 = interpolate(p2_1, ptI, 0.5)
+                    let pI_3 = interpolate(pI_2, pI_1, 0.5)
+                    //renderPoint(markers, pI_3, 'red', '2%')
+
+                    semiExtremeMid.x = pI_3.x
+                    semiExtremeMid.y = pI_3.y
+                    semiExtremeMid.tangentL = pI_1
+                    semiExtremeMid.tangentR = pI_2
+                    //p1.idx=i
+                    //offset += semiExtremes.length - 1
+                    //ptsClean.push(p1)
+
+                    i += offset
+                    continue
+                } 
+
+                //console.log('semiExtremes', semiExtremes);
+            }
+        } 
+
+        //p1.idx=i
+        ptsClean.push(p1)
+        // find significant of same type
+
+    }
+
+
+    /*
+    // update index
+    ptsClean.forEach((pt, i) => {
+        pt.idx = i
+    })
+    */
+    //console.log('ptsClean', ptsClean);
+    //renderPoint(markers, ptsClean[0], 'green', '4%')
+    return pts;
+    //return ptsClean;
+}

package/src/svgii/poly_analyze_getTangents.js

@@ -0,0 +1,125 @@
+import { adjustTangentAngle } from "../poly-fit-curve-schneider_check_bulge";
+import { getPolyBBox } from "./geometry_bbox";
+import { renderPoint } from "./visualize";
+
+export function getTangents(pts = [], {
+    x = 0,
+    y = 0,
+    width = 0,
+    height = 0,
+    debug = false,
+    closed=false,
+} = {}) {
+
+    let l = pts.length;
+
+    // bounding box of this sub poly
+    if (!width || !height) {
+        ({ x, y, width, height } = getPolyBBox(pts));
+    }
+
+    //console.log(polyArea);
+    let thresh = (width + height) * 0.01;
+
+    // threshold for horizontal or vertical detection
+    //let thresh2 = thresh * 0.5
+
+
+    for (let i = 0; i < l; i++) {
+        let p0 = i > 0 ? pts[i - 1] : pts[l - 1];
+        let p1 = pts[i];
+        let p2 = i < l - 1 ? pts[i + 1] : pts[l - 1];
+        let p3 = i < l - 1 ? pts[i + 2] : pts[l - 1];
+
+        let { isHorizontal, isVertical, isCorner, isLong, isExtreme, isSemiExtreme, isDirChange } = p1
+
+
+
+        // default
+        let tangentL = { x: p1.x - p1.dx2 * 0.5, y: p1.y - p1.dy2 * 0.5 }
+        let tangentR = { x: p1.x + p1.dx2 * 0.5, y: p1.y + p1.dy2 * 0.5 }
+
+
+        // average first tangent
+        if(i===0){
+            tangentR = adjustTangentAngle(p2, p1, p2, p3)
+        }
+
+
+        /**
+         * add left and right tangents
+         * for later curve fitting
+         */
+
+        if (isHorizontal && !isCorner) {
+            tangentL = { x: p1.x - p1.dx2*0.5, y: p1.y }
+            tangentR = { x: p1.x + p1.dx2*0.5, y: p1.y }
+        }
+        else if (isVertical) {
+            tangentL = { x: p1.x , y: p1.y - p1.dy2*0.5 }
+            tangentR = { x: p1.x , y: p1.y + p1.dy2*0.5 }
+        }
+
+
+        if (!isExtreme && p1.isLong) {
+            tangentL = { x: p1.x - p1.dx*0.5, y: p1.y - p1.dy*0.5 }
+            tangentR = { x: p1.x + p1.dx*0.5, y: p1.y + p1.dy*0.5 }
+        }
+
+
+        /*
+        //isDirChange && !isCorner && !isHorizontal && !isVertical
+        if (isDirChange && !isCorner && !isExtreme) {
+            p1.tangentL = { x: p1.x-p1.dx2*0.5, y: p1.y-p1.dy2*0.5 }
+            p1.tangentR = { x: p1.x+p1.dx2*0.5, y: p1.y+p1.dy2*0.5 }
+        }
+        */
+
+        if (isCorner) {
+
+            tangentL = {x:p0.x, y:p0.y}
+            tangentR = {x:p2.x, y:p2.y}
+
+            //let p0_1 = pts[i - 2] ? pts[i - 2] : pts[l - 2]
+            let p0_1 = pts[i - 2] ? pts[i - 2] : pts[l - 1]
+            //let p2_1 = pts[i + 2] ? pts[i + 2] : pts[l - 2]
+            let p2_1 = pts[i + 2] ? pts[i + 2] : pts[1]
+
+            // adjust angle
+            if (!p0.isCorner) {
+                tangentL = adjustTangentAngle(p0, p1, p0, p0_1)
+            }
+
+            if (!p2.isCorner) {
+                tangentR = adjustTangentAngle(tangentR, p1, p2, p2_1)
+            }
+
+            /*
+            renderPoint(markers, p0, 'darkblue', '0.75%', '0.5')
+            // renderPoint(markers, p0_1, 'blue', '0.5%')
+            renderPoint(markers, tangentL, 'blue', '0.5%', '0.5')
+            renderPoint(markers, tangentR, 'blue', '0.5%', '0.5')
+            */
+
+        }
+
+        p1.tangentL = tangentL
+        p1.tangentR = tangentR
+
+
+        //console.log('t', p1.tangentL, p1.tangentR);
+
+        /*
+         debug = true
+         if(debug){
+             if (isCorner || isSemiExtreme || isDirChange || isExtreme) {
+                 renderPoint(markers, p1.tangentL, 'darkred', '0.5%')
+                 renderPoint(markers, p1.tangentR, 'darkblue', '0.5%')
+             }
+         }
+        */
+
+
+    }
+
+}

package/src/svgii/poly_analyze_get_chunks.js

@@ -27,7 +27,9 @@ export function getPolyChunks(pts,
 
         // start new chunk
         // keepInflections && p1.isDirChange
-        if ((keepExtremes && p1.isExtreme || keepCorners && p1.isCorner )) {
+        if ((keepExtremes && p1.isExtreme || keepCorners && p1.isCorner ||
+             (keepInflections && p1.isDirChange && !p1.isExtreme && !p1.isCorner ) 
+            )) {
             idx++
             chunks.push([])
         }

package/src/svgii/poly_normalize.js

@@ -4,20 +4,33 @@ export function normalizePoly(pts, {
     flatten = false
 } = {}) {
 
+
     // is stringified flat point attribute
-    if(typeof pts === 'string' && !isNaN(pts[0])){
+    if (typeof pts === 'string' && !isNaN(pts[0])) {
         pts = toPointArray(pts.split(/,| /).filter(Boolean).map(Number));
         return pts
     }
 
+    if (pts.length && typeof pts[0] === 'string') {
+        pts = pts.map(pt => {
+            return toPointArray(pt.split(/,| /).filter(Boolean).map(Number))
+        });
+        pts = pts.flat(2)
+        //console.log(pts);
+    }
+
+
     if (flatten) pts = pts.flat(2);
+
+
     let poly = toArray ? polyPtsToArray(pts) : polyArrayToObject(pts)
     return poly
 }
 
 
-export function polyArrayToObject(pts) {
-
+export function polyArrayToObject(pts = []) {
+    //console.log(pts);
+    if (!pts.length) return [];
     // is point object array
     if (pts[0].x !== undefined && pts[0].y !== undefined) return pts
 
@@ -35,7 +48,7 @@ export function polyArrayToObject(pts) {
         return poly
     }
 
-    else if(pts.length>3){
+    else if (pts.length > 3) {
         pts = toPointArray(pts)
         return pts
     }
@@ -65,13 +78,13 @@ export function polyPtsToArray(pts) {
 export function toPointArray(pts) {
     let ptArr = [];
 
-    if(pts[0].length===2){
-        for (let i = 0, l = pts.length; i < l; i ++) {
+    if (pts[0].length === 2) {
+        for (let i = 0, l = pts.length; i < l; i++) {
             let pt = pts[i]
-            ptArr.push({ x: pt[0], y:pt[1] });
+            ptArr.push({ x: pt[0], y: pt[1] });
         }
 
-    }else{
+    } else {
         for (let i = 1, l = pts.length; i < l; i += 2) {
             ptArr.push({ x: pts[i - 1], y: pts[i] });
         }