svg-path-simplify 0.4.3 → 0.4.4

package/src/svgii/pathData_simplify_refine_round.js

@@ -0,0 +1,420 @@
+import { checkLineIntersection, getAngle, getDistAv, getDistManhattan, getDistance, getPointOnEllipse, getSquareDistance, pointAtT, rotatePoint } from "./geometry";
+import { getPolygonArea } from "./geometry_area";
+import { getArcFromPoly } from "./geometry_deduceRadius";
+import { arcToBezierResolved, convertSmallArcsToLinetos, revertCubicQuadratic } from "./pathData_convert";
+import { pathDataToD } from "./pathData_stringify";
+import { renderPath, renderPoint, renderPoly } from "./visualize";
+
+
+export function simplifyAdjacentRound(pathData, {
+    threshold = 0,
+    tolerance = 1,
+    // take arcs or cubic beziers
+    toCubic = false,
+    debug = false
+} = {}) {
+
+
+    // fix small Arcs
+    pathData = convertSmallArcsToLinetos(pathData);
+    //return pathData
+
+    // min size threshold for corners
+    threshold *= tolerance;
+
+    let l = pathData.length;
+
+    // add fist command
+    let pathDataN = [pathData[0]]
+
+
+    // find adjacent cubics between extremes
+    //console.log(pathData);
+
+    for (let i = 1; i < l; i++) {
+        let comPrev = pathData[i - 1];
+        let com = pathData[i];
+        let comN = pathData[i + 1] || null;
+
+        if (!comN) {
+            pathDataN.push(com);
+            break
+        }
+
+        let { type, extreme = false, p0, p, dimA = 0 } = com;
+        // for short segment detection
+        let dimAN = comN.dimA;
+        let dimA0 = dimA + dimAN;
+        let thresh = 0.1
+        let extreme0 = extreme
+
+        // ignore short linetos
+        let isShortN = dimAN < dimA0 * thresh;
+        //let isFlat = 
+
+
+        // adjacent cubic commands - accept short in between linetos
+        if ((type === 'C') && (comN.type === 'C' || isShortN)) {
+
+            //console.log((comN.type !== 'C' && isShortN), comN);
+            let candidates = []
+
+            for (let j = i + 1; j < l; j++) {
+                let comN = pathData[j];
+                let { type, extreme = false, corner = false, dimA = 0 } = comN;
+                let isShort = dimA < dimA0 * thresh;
+
+                // skip for type change(unless very short), extremes or corners
+                /*
+                if ( (comN.extreme || comN.corner) ) {
+                    if(!extreme && !corner) candidates.push(comN)
+                    break;
+                }
+                */
+
+                //|| (type !== 'C' && !isShort && !corner && !extreme)
+                if (extreme || corner) {
+
+                    /*
+                    if (comN.extreme) {
+                        renderPoint(markers, comN.p, 'cyan')
+                    }
+                    else if (comN.corner) {
+                        renderPoint(markers, comN.p, 'magenta')
+                    }
+                    else if (type !== 'C') {
+                        console.log(type);
+                        renderPoint(markers, comN.p, 'orange')
+                    }
+                    */
+
+                    if ((extreme || corner) && type === 'C') {
+                        //renderPoint(markers, com.p, 'purple')
+                        //break
+                    }
+
+                    //&& comN.type !== 'C'
+                    if (isShort && comN.type !== 'C') {
+                        //renderPoint(markers, comN.p, 'purple')
+                        //candidates.push(comN)
+                    }
+
+
+                    if ((extreme && !corner)) {
+                        //console.log(comN);
+                        //if(extreme) renderPoint(markers, comN.p0, 'purple')
+                        //candidates.push(comN)
+                        candidates.push(comN)
+                    }
+
+                    break;
+                }
+
+
+                candidates.push(comN)
+            }
+
+            // try to create arc command
+            if (candidates.length > 1) {
+
+                let clen = candidates.length;
+                let pts = [com.p0, com.p,];
+
+                // add interpolated points to prevent wrong arc replacements
+                candidates.forEach(c => {
+                    if (c.type === 'C') {
+                        let pt = pointAtT([c.p0, c.cp1, c.cp2, c.p], 0.5)
+                        pts.push(pt)
+                    }
+                    pts.push(c.p)
+                })
+
+                //let pts = [com.p0, com.p, ...candidates.map(com => com.p)];
+                //console.log('pts', pts);
+
+                let precise = true
+                let arcProps = getArcFromPoly(pts, precise)
+
+                // could be combined
+                if (arcProps) {
+                    //console.log(arcProps, pts);
+
+                    let { centroid, r, deltaAngle, startAngle, endAngle } = arcProps;
+                    let sweep = deltaAngle > 0 ? 1 : 0;
+                    //let area = getPolygonArea(pts)
+                    //let sweep = area > 0 ? 1 : 0;
+                    let largeArc = Math.abs(deltaAngle) > Math.PI ? 1 : 0;
+                    largeArc = 0;
+                    let comLast = candidates[clen - 1]
+                    let p = comLast.p
+
+                    let comArc = { type: 'A', values: [r, r, 0, largeArc, sweep, p.x, p.y] }
+
+                    //console.log(comArc);
+
+                    comArc.dimA = getDistManhattan(p0, p)
+                    comArc.p0 = p0
+                    comArc.p = p
+                    comArc.error = 0
+                    comArc.directionChange = comLast.directionChange
+                    comArc.extreme = comLast.extreme
+                    comArc.corner = comLast.corner
+                    pathDataN.push(comArc)
+
+                    i += candidates.length
+                    continue
+
+                }
+
+                // arc radius calculation failed - return original
+                else {
+                    pathDataN.push(com)
+                }
+            }
+
+            // could not be simplified – return original command
+            else {
+                pathDataN.push(com)
+            }
+
+        }
+        // all other commands
+        else {
+            pathDataN.push(com)
+        }
+    }
+
+    //console.log(pathDataN);
+    return pathDataN
+}
+
+
+export function refineRoundSegments(pathData, {
+    threshold = 0,
+    tolerance = 1,
+    // take arcs or cubic beziers
+    toCubic = false,
+    debug = false
+} = {}) {
+
+
+    // min size threshold for corners
+    threshold *= tolerance;
+
+    let l = pathData.length;
+
+    // add fist command
+    let pathDataN = [pathData[0]]
+
+    // just for debugging
+    let pathDataTest = []
+
+    for (let i = 1; i < l; i++) {
+        let com = pathData[i];
+        let { type } = com;
+        let comP = pathData[i - 1];
+        let comN = pathData[i + 1] ? pathData[i + 1] : null;
+        let comN2 = pathData[i + 2] ? pathData[i + 2] : null;
+        let comN3 = pathData[i + 3] ? pathData[i + 3] : null;
+        let comBez = null;
+
+        if ((com.type === 'C' || com.type === 'Q')) comBez = com;
+        else if (comN && (comN.type === 'C' || comN.type === 'Q')) comBez = comN;
+
+
+        let cpts = comBez ? (comBez.type === 'C' ? [comBez.p0, comBez.cp1, comBez.cp2, comBez.p] : [comBez.p0, comBez.cp1, comBez.p]) : []
+
+        let areaBez = 0;
+        let areaLines = 0;
+        let signChange = false;
+        let L1, L2;
+        let combine = false
+
+        let p0_S, p_S;
+        let poly = []
+        let pMid;
+
+
+        // 2. line-line-bezier-line-line
+        if (
+            comN2 && comN3 &&
+            comP.type === 'L' &&
+            type === 'L' &&
+            comBez &&
+            comN2.type === 'L' &&
+            (comN3.type === 'L' || comN3.type === 'Z')
+        ) {
+
+            L1 = [com.p0, com.p];
+            L2 = [comN2.p0, comN2.p];
+            p0_S = com.p0
+            p_S = comN2.p
+
+            // don't allow sign changes
+            areaBez = getPolygonArea(cpts, false)
+            areaLines = getPolygonArea([...L1, ...L2], false)
+            signChange = (areaBez < 0 && areaLines > 0) || (areaBez > 0 && areaLines < 0)
+
+            if (!signChange) {
+
+                // mid point of mid bezier
+                pMid = pointAtT(cpts, 0.5)
+
+                // add to poly
+                poly = [p0_S, pMid, p_S]
+
+                combine = true
+            }
+
+        }
+
+        // 1. line-bezier-bezier-line
+        else if (comN && (type === 'C' || type === 'Q') && comP.type === 'L') {
+
+            //renderPoint(markers, com.p)
+
+            // 1.2 next is cubic next is lineto
+            if (comN2 && comN2.type === 'L' && (comN.type === 'C' || comN.type === 'Q')) {
+
+                combine = true
+
+                L1 = [comP.p0, comP.p];
+                L2 = [comN2.p0, comN2.p];
+                p0_S = comP.p
+                p_S = comN2.p0
+
+                // mid point of mid bezier
+                pMid = comBez.p
+
+                // add to poly
+                poly = [p0_S, comBez.p, p_S]
+
+
+            }
+        }
+
+
+        /**
+         * calculate either combined
+         * cubic or arc commands
+         */
+        if (combine) {
+
+
+            // try to find center of arc
+            let arcProps = getArcFromPoly(poly)
+            if (arcProps) {
+
+                let { centroid, r, deltaAngle, startAngle, endAngle } = arcProps;
+
+                let xAxisRotation = 0;
+                let sweep = deltaAngle > 0 ? 1 : 0;
+                let largeArc = Math.abs(deltaAngle) > Math.PI ? 1 : 0;
+
+                let pCM = rotatePoint(p0_S, centroid.x, centroid.y, deltaAngle * 0.5)
+
+
+                let dist2 = getDistAv(pCM, pMid)
+                let thresh = getDistAv(p0_S, p_S) * 0.05
+                let bezierCommands;
+
+                // point is close enough
+                if (dist2 < thresh) {
+
+                    //toCubic = false;
+
+                    bezierCommands = arcToBezierResolved(
+                        {
+                            p0: p0_S,
+                            p: p_S,
+                            centroid,
+                            rx: r,
+                            ry: r,
+                            xAxisRotation,
+                            sweep,
+                            largeArc,
+                            deltaAngle,
+                            startAngle,
+                            endAngle
+                        }
+                    );
+
+                    if (bezierCommands.length === 1) {
+
+                        // prefer more compact quadratic - otherwise arcs
+                        let comBezier = revertCubicQuadratic(p0_S, bezierCommands[0].cp1, bezierCommands[0].cp2, p_S)
+
+                        if (comBezier.type === 'Q') {
+                            toCubic = true
+                        }else{
+                            comBezier = bezierCommands[0]
+                        }
+
+                        com = comBezier
+                        //console.log('bezierCommands', comBezier);
+
+                    }
+
+
+                    // prefer arcs if 2 cubics are required
+                    if (bezierCommands.length > 1) toCubic = false;
+
+
+                    //toCubic = false
+
+                    // return elliptic arc commands
+                    if (!toCubic) {
+                        // rewrite simplified command
+                        com.type = 'A'
+                        com.values = [r, r, xAxisRotation, largeArc, sweep, p_S.x, p_S.y];
+                    }
+
+                    //console.log(com);
+
+                    com.p0 = p0_S;
+                    com.p = p_S;
+                    com.extreme = false;
+                    com.corner = false;
+
+                    // test rendering
+                    //debug=true
+
+                    /*
+                    if (debug) {
+                        // arcs
+                        if (!toCubic) {
+                            pathDataTest = [
+                                { type: 'M', values: [p0_S.x, p0_S.y] },
+                                { type: 'A', values: [r, r, xAxisRotation, largeArc, sweep, p_S.x, p_S.y] },
+                            ]
+                        }
+                        // cubics
+                        else {
+                            pathDataTest = [
+                                { type: 'M', values: [p0_S.x, p0_S.y] },
+                                ...bezierCommands
+                            ]
+
+                        }
+
+                        let d = pathDataToD(pathDataTest);
+                        renderPath(markers, d, 'orange', '0.5%', '0.5')
+                    }
+                    */
+
+                    pathDataN.push(com);
+                    i++
+                    continue
+
+                }
+            }
+        }
+
+        // pass through
+        pathDataN.push(com)
+    }
+
+    //let d= pathDataToD(pathDataN)
+    //console.log('!pathDataN', d);
+    return pathDataN;
+}

package/src/svgii/rounding.js

@@ -8,6 +8,42 @@ import { getDistAv, getDistManhattan } from "./geometry";
 
 
 
+/**
+ * round path data
+ * either by explicit decimal value or
+ * based on suggested accuracy in path data
+ */
+export function roundPathData(pathData, decimalsGlobal = -1) {
+
+    if (decimalsGlobal < 0) return pathData;
+
+    let len = pathData.length;
+    let decimals = decimalsGlobal
+    let decimalsArc = decimals < 3 ? decimals+2 : decimals
+    //decimalsArc = decimals
+    //console.log(decimalsArc);
+
+    for (let c = 0; c < len; c++) {
+        let com = pathData[c];
+        let { type, values } = com
+        let valLen = values.length;
+        if (!valLen) continue
+
+        let isArc = type.toLowerCase() === 'a'
+
+        for (let v = 0; v < valLen; v++) {
+            // allow higher accuracy for arc radii (... it's always arcs)
+            pathData[c].values[v] = isArc && v < 2 ? roundTo(values[v], decimalsArc) : roundTo(values[v], decimals);
+        }
+    };
+
+    //console.log(pathData);
+    return pathData;
+}
+
+
+
+
 export function detectAccuracyPoly(pts) {
 
     let minDim = Infinity
@@ -20,7 +56,7 @@ export function detectAccuracyPoly(pts) {
         let { p0 = null, p = null, dimA = 0 } = pt;
 
         // use existing averave dimension value or calculate
-        if ( p && p0) {
+        if (p && p0) {
             dimA = dimA ? dimA : getDistManhattan(p0, p);
 
             if (dimA) dims.push(dimA);
@@ -84,11 +120,37 @@ export function detectAccuracy(pathData) {
 
 }
 
+/**
+ * rounding helper
+ * allows for quantized rounding
+ * e.g 0.5 decimals s
+ */
+export function roundTo(num = 0, decimals = 3) {
+    if (decimals < 0) return num;
+    // Normal integer rounding
+    if (!decimals) return Math.round(num);
+
+    // stepped rounding
+    let intPart = Math.floor(decimals);
+    //let fracPart = decimals.toString().split('.');
+    //fracPart = fracPart[1] ? +fracPart[1] : 0
+
+    if (intPart !== decimals) {
+        let f = +(decimals - intPart).toFixed(2)
+        f = f > 0.5 ? (Math.floor((f) / 0.5) * 0.5) : f;
+        //console.log('fracPart', f);
+        let step = 10 ** -intPart * f;
+        return +(Math.round(num / step) * step).toFixed(8);
+    }
+
+    let factor = 10 ** decimals;
+    return Math.round(num * factor) / factor;
+}
 
 
 
-export function roundTo(num = 0, decimals = 3) {
-    if(decimals<=-1) return num;
+export function roundTo__(num = 0, decimals = 3) {
+    if (decimals <= -1) return num;
     if (!decimals) return Math.round(num);
     let factor = 10 ** decimals;
     return Math.round(num * factor) / factor;
@@ -99,85 +161,24 @@ export function roundTo(num = 0, decimals = 3) {
  * floating point accuracy 
  * based on numeric value
  */
-export function autoRound(val, integerThresh = 50){
-  let decimals=8;  
-  
-  if(val>integerThresh*2){
-    decimals=0
-  }
-  else if(val>integerThresh){
-    decimals=1
-  }else{
-     decimals=Math.ceil(500/val).toString().length
-     //console.log('decimals small', val, decimals);
-  }
-      
-  //console.log(val, decimals);
-  let factor = 10 ** decimals;
-  return Math.round(val * factor) / factor;
-}
-
-
-
-
-/**
- * round path data
- * either by explicit decimal value or
- * based on suggested accuracy in path data
- */
-export function roundPathData(pathData, decimalsGlobal = -1) {
+export function autoRound(val, integerThresh = 50) {
+    let decimals = 8;
 
-    if (decimalsGlobal < 0) return pathData;
-
-    let len = pathData.length;
-    //let decimals = pathData[0].decimals ? pathData[0].decimals+1 : decimalsGlobal
-    let decimals = decimalsGlobal
-    //decimals = decimalsGlobal;
-    //console.log('decimals subpath', decimals, pathData[0].decimals, 'decimalsGlobal', decimalsGlobal);
-
-    for (let c = 0; c < len; c++) {
-        let com = pathData[c];
-        let {values} = com
-        //let values = pathData[c].values
-        let valLen = values.length;
-        if (!valLen) continue
-
-        for (let v = 0; v < valLen; v++) {
-            pathData[c].values[v] = roundTo(values[v], decimals);
-        }
-    };
+    if (val > integerThresh * 2) {
+        decimals = 0
+    }
+    else if (val > integerThresh) {
+        decimals = 1
+    } else {
+        decimals = Math.ceil(500 / val).toString().length
+        //console.log('decimals small', val, decimals);
+    }
 
-    //console.log(pathData);
-    return pathData;
+    //console.log(val, decimals);
+    let factor = 10 ** decimals;
+    return Math.round(val * factor) / factor;
 }
 
 
-export function roundPathData_(pathData, decimals = -1) {
-
-    if (decimals < 0) return pathData;
-
-    let len = pathData.length;
-    let c = 0;
-    while (c < len) {
-
-        //let com = pathData[c];
-        let values = pathData[c].values
-        let valLen = values.length;
-
-        // Z commands have no values
-        if (!valLen) {
-            c++; continue
-        }
-
-        let v = 0;
-        while (v < valLen) {
-            pathData[c].values[v] = roundTo(values[v], decimals);
-            v++
-        }
-        c++
 
-    };
 
-    //console.log(pathData);
-    return pathData;
-}