svg-path-simplify 0.4.3 → 0.4.4

package/src/svgii/pathData_reorder.js

@@ -14,7 +14,6 @@ export function pathDataToTopLeft(pathData) {
     let len = pathData.length;
     let isClosed = pathData[len - 1].type.toLowerCase() === 'z'
 
-    //return pathData;
 
     // we can't change starting point for non closed paths
     if (!isClosed) {
@@ -30,7 +29,7 @@ export function pathDataToTopLeft(pathData) {
         let { type, values } = com;
         let valsLen = values.length
         if (valsLen) {
-            let p = { type: type, x: values[valsLen-2], y: values[valsLen-1], index: 0}
+            let p = { type: type, x: values[valsLen - 2], y: values[valsLen - 1], index: 0 }
             p.index = i
             indices.push(p)
         }
@@ -38,16 +37,124 @@ export function pathDataToTopLeft(pathData) {
 
     // reorder  to top left most
     //|| a.x - b.x
-    indices = indices.sort((a, b) => +a.y.toFixed(8) - +b.y.toFixed(8) || a.x-b.x );
+    indices = indices.sort((a, b) => +a.y.toFixed(8) - +b.y.toFixed(8) || a.x - b.x);
     newIndex = indices[0].index
 
-    return  newIndex ? shiftSvgStartingPoint(pathData, newIndex) : pathData;
+    return newIndex ? shiftSvgStartingPoint(pathData, newIndex) : pathData;
 }
 
 
+export function optimizeClosePath(pathData, { removeFinalLineto = true, autoClose = true } = {}) {
 
+    let pathDataN = pathData;
+    let l = pathData.length;
+    let M = { x: +pathData[0].values[0].toFixed(8), y: +pathData[0].values[1].toFixed(8) }
+    let isClosed = pathData[l - 1].type.toLowerCase() === 'z'
+    //let linetos = pathData.filter(com => com.type === 'L')
+    //let hasLinetos = linetos.length;
+    let hasLinetos = false
+
+
+    // check if path is closed by explicit lineto
+    let idxPenultimate = isClosed ? l - 2 : l - 1
+    let penultimateCom = pathData[idxPenultimate];
+    let penultimateType = penultimateCom.type;
+    let penultimateComCoords = penultimateCom.values.slice(-2).map(val => +val.toFixed(8))
+
+    // last L command ends at M 
+    let hasClosingCommand = penultimateComCoords[0] === M.x && penultimateComCoords[1] === M.y
+    let lastIsLine = penultimateType === 'L'
+    //console.log(pathData);
+
+    // create index
+    let indices = [];
+    for (let i = 0; i < l; i++) {
+        let com = pathData[i];
+        let { type, values, p0, p } = com;
+
+        if(type==='L') hasLinetos = true;
+
+        // exclude Z
+        if (values.length) {
+            let valsL = values.slice(-2)
+
+            let x = Math.min(p0.x, p.x)
+            let y = Math.min(p0.y, p.y)
+
+            let prevCom = pathData[i - 1] ? pathData[i - 1] : pathData[idxPenultimate]
+            let prevType = prevCom.type
+            //let p = { type: type, x: valsL[0], y: valsL[1], dist: 0, index: 0, prevType }
+            let item = { type: type, x, y, index: 0, prevType }
+            item.index = i
+            indices.push(item)
+        }
+
+    }
+
+    let xMin = Infinity;
+    let yMin = Infinity;
+    let idx_top = null;
+    let len = indices.length
+
+
+    for (let i = 0; i < len; i++) {
+        let com = indices[i];
+        let { type, index, x, y, prevType } = com;
+
+        if (hasLinetos && prevType === 'L') {
+            if (x < xMin && y < yMin) {
+                idx_top = index-1;
+            }
+
+            if (y < yMin) {
+                yMin = y
+            }
+
+            if (x < xMin) {
+                xMin = x
+            }
+        }
+    }
+
+
+    // shift to better starting point
+    if (idx_top) {
+        pathDataN = shiftSvgStartingPoint(pathDataN, idx_top)
+
+        // update penultimate - reorder might have added new close paths
+        l = pathDataN.length
+        M = { x: +pathDataN[0].values[0].toFixed(8), y: +pathDataN[0].values[1].toFixed(8) }
+
+        idxPenultimate = isClosed ? l - 2 : l - 1
+        penultimateCom = pathDataN[idxPenultimate];
+        penultimateType = penultimateCom.type;
+        penultimateComCoords = penultimateCom.values.slice(-2).map(val => +val.toFixed(8))
+        lastIsLine = penultimateType ==='L'
+
+        // last L command ends at M 
+        hasClosingCommand = penultimateComCoords[0] === M.x && penultimateComCoords[1] === M.y
+
+    }
 
-export function optimizeClosePath(pathData, {removeFinalLineto = true, autoClose = true}={}) {
+
+    // remove unnecessary closing lineto
+    if (removeFinalLineto && hasClosingCommand && lastIsLine) {
+        pathDataN.splice(l - 2, 1)
+    }
+
+    // add close path
+    if (autoClose && !isClosed && hasClosingCommand) {
+        pathDataN.push({ type: 'Z', values: [] })
+    }
+
+    return pathDataN
+
+}
+
+
+
+
+export function optimizeClosePath__(pathData, { removeFinalLineto = true, autoClose = true } = {}) {
 
     let pathDataNew = [];
     let l = pathData.length;
@@ -58,17 +165,16 @@ export function optimizeClosePath(pathData, {removeFinalLineto = true, autoClose
 
 
     // check if order is ideal
-    let idxPenultimate = isClosed ? l-2 : l-1
-
+    let idxPenultimate = isClosed ? l - 2 : l - 1
     let penultimateCom = pathData[idxPenultimate];
     let penultimateType = penultimateCom.type;
     let penultimateComCoords = penultimateCom.values.slice(-2).map(val => +val.toFixed(8))
 
     // last L command ends at M 
-    let isClosingCommand = penultimateComCoords[0] === M.x && penultimateComCoords[1] === M.y
+    let hasClosingCommand = penultimateComCoords[0] === M.x && penultimateComCoords[1] === M.y
 
     // add closepath Z to enable order optimizations
-    if(!isClosed && autoClose && isClosingCommand){
+    if (!isClosed && autoClose && hasClosingCommand) {
 
         /*
         // adjust final coords
@@ -77,14 +183,14 @@ export function optimizeClosePath(pathData, {removeFinalLineto = true, autoClose
         pathData[idxPenultimate].values[valsLastLen-2] = M.x
         pathData[idxPenultimate].values[valsLastLen-1] = M.y
         */
-        
-        pathData.push({type:'Z', values:[]})
+
+        pathData.push({ type: 'Z', values: [] })
         isClosed = true;
         l++
     }
 
     // if last segment is not closing or a lineto
-    let skipReorder = pathData[1].type !== 'L' && (!isClosingCommand || penultimateCom.type === 'L')
+    let skipReorder = pathData[1].type !== 'L' && (!hasClosingCommand || penultimateCom.type === 'L')
     skipReorder = false
 
 
@@ -143,13 +249,13 @@ export function optimizeClosePath(pathData, {removeFinalLineto = true, autoClose
     // remove last lineto
     penultimateCom = pathData[l - 2];
     penultimateType = penultimateCom.type;
-    penultimateComCoords = penultimateCom.values.slice(-2).map(val=>+val.toFixed(8))
+    penultimateComCoords = penultimateCom.values.slice(-2).map(val => +val.toFixed(8))
 
-    isClosingCommand = penultimateType === 'L' && penultimateComCoords[0] === M.x && penultimateComCoords[1] === M.y
+    hasClosingCommand = penultimateType === 'L' && penultimateComCoords[0] === M.x && penultimateComCoords[1] === M.y
 
-    //console.log('penultimateCom', isClosingCommand, penultimateCom.values, M);
+    //console.log('penultimateCom', hasClosingCommand, penultimateCom.values, M);
 
-    if (removeFinalLineto && isClosingCommand) {
+    if (removeFinalLineto && hasClosingCommand) {
         pathData.splice(l - 2, 1)
     }
 

package/src/svgii/pathData_simplify_refineCorners.js

@@ -1,10 +1,14 @@
 import { checkLineIntersection, getDistManhattan, getSquareDistance, interpolate, pointAtT } from "./geometry";
 import { getPolygonArea } from "./geometry_area";
+import { getArcFromPoly } from "./geometry_deduceRadius";
 import { commandIsFlat } from "./geometry_flatness";
+import { pathDataToD } from "./pathData_stringify";
+import { roundTo } from "./rounding";
 import { renderPoint } from "./visualize";
 
 export function refineRoundedCorners(pathData, {
     threshold = 0,
+    simplifyQuadraticCorners = false,
     tolerance = 1
 } = {}) {
 
@@ -30,6 +34,9 @@ export function refineRoundedCorners(pathData, {
     let firstIsLine = pathData[1].type === 'L';
     let firstIsBez = pathData[1].type === 'C';
 
+    // in case we have simplified a corner connecting to the start
+    let M_adj = null;
+
 
     let normalizeClose = isClosed && firstIsBez && (lastIsLine || zIsLineto);
 
@@ -70,15 +77,18 @@ export function refineRoundedCorners(pathData, {
             // closing corner to start
             if (isClosed && lastIsBez && firstIsLine && i === l - lastOff - 1) {
                 comL1 = pathData[1]
+                //???
                 comBez = [pathData[l - lastOff]]
+
                 //renderPoint(markers, com.p)
             }
 
+            // collect enclosed bezier segments
             for (let j = i + 1; j < l; j++) {
                 let comN = pathData[j] ? pathData[j] : null;
                 let comPrev = pathData[j - 1];
 
-                if (comPrev.type === 'C') {
+                if (comPrev.type === 'C' && j > 2) {
                     comBez.push(comPrev)
                 }
 
@@ -89,9 +99,13 @@ export function refineRoundedCorners(pathData, {
                 offset++
             }
 
+
+            //comBez = comBez.filter(com=> com.values.join(''))
+
             if (comL1) {
                 //console.log('comL1', comL1);
 
+
                 // linetos
                 let len1 = getDistManhattan(comL0.p0, comL0.p)
                 let len2 = getDistManhattan(comL1.p0, comL1.p)
@@ -113,43 +127,77 @@ export function refineRoundedCorners(pathData, {
                 let isSmall = bezThresh < len1 && bezThresh < len2;
 
 
+                /*
+                */
+
+
                 //len1 > len3 && len2 > len3
                 if (comBez.length && !signChange && isSmall) {
 
-                    let isFlatBezier = Math.abs(area2) < getSquareDistance(comBez[0].p0, comBez[0].p) * 0.005
+
+                    let isSquare = false;
+
+                    if (comBez.length === 1) {
+                        let dx = Math.abs(comBez[0].p.x - comBez[0].p0.x)
+                        let dy = Math.abs(comBez[0].p.y - comBez[0].p0.y)
+                        let diff = (dx - dy)
+                        let rat = Math.abs(diff / dx)
+                        isSquare = rat < 0.01;
+                    }
+
+
+                    let preferArcs = true;
+                    preferArcs = false;
+
+
+                    // if rectangular prefer arcs
+                    if (preferArcs && isSquare) {
+
+                        let pM = pointAtT([comBez[0].p0, comBez[0].cp1, comBez[0].cp2, comBez[0].p], 0.5)
+
+                        let arcProps = getArcFromPoly([comBez[0].p0, pM, comBez[0].p])
+                        let { r, centroid, deltaAngle } = arcProps;
+
+                        let sweep = deltaAngle > 0 ? 1 : 0;
+                        //let largeArc = Math.abs(deltaAngle) > Math.PI ? 1 : 0;
+                        let largeArc = 0;
+
+                        let comArc = { type: 'A', values: [r, r, 0, largeArc, sweep, comBez[0].p.x, comBez[0].p.y] }
+
+                        pathDataN.push(comL0, comArc);
+                        i += offset
+                        continue
+
+                    }
+
+
+
+
+                    let areaThresh = getSquareDistance(comBez[0].p0, comBez[0].p) * 0.005
+                    let isFlatBezier = Math.abs(area2) < areaThresh;
+                    let isFlatBezier2 = Math.abs(area2) < areaThresh * 10
+
+
                     let ptQ = !isFlatBezier ? checkLineIntersection(comL0.p0, comL0.p, comL1.p, comL1.p0, false, true) : null
 
-                    if (!ptQ) {
+
+                    // exit: is rather flat or has no intersection
+                    //|| (isFlatBezier && comBez.length === 1)
+                    if (!ptQ || (isFlatBezier2 && comBez.length === 1)) {
                         pathDataN.push(com);
                         continue
                     }
 
-                    // check sign change
+                    // check sign change - exit if present
                     if (ptQ) {
                         let area0 = getPolygonArea([comL0.p0, comL0.p, comL1.p0, comL1.p], false);
                         let area0_abs = Math.abs(area0);
                         let area1 = getPolygonArea([comL0.p0, comL0.p, ptQ, comL1.p0, comL1.p], false);
                         let area1_abs = Math.abs(area1);
                         let areaDiff = Math.abs(area0_abs - area1_abs) / area0_abs
-                        //console.log('areaDiff', areaDiff);
-
-
-                        /*
-                        renderPoint(markers, comL0.p0, 'green', '0.5%', '0.5')
-                        renderPoint(markers, comL0.p, 'red', '1.5%', '0.5')
-                        renderPoint(markers, comL1.p0, 'blue', '0.5%', '0.5')
-                        renderPoint(markers, comL1.p, 'orange', '0.5%', '0.5')
-                        if(!area0) {
-                            pathDataN.push(com);
-                            continue
-                        }
-                        */
-
                         let signChange = area0 < 0 && area1 > 0 || area0 > 0 && area1 < 0;
 
                         if (!ptQ || signChange || areaDiff > 0.5) {
-                            //console.log(signChange, area0, area1, 'pts', comL0.p0, comL0.p, comL1.p0, comL1.p);
-                            //renderPoint(markers, ptQ, 'cyan', '0.5%', '0.5')
                             pathDataN.push(com);
                             continue
                         }
@@ -168,28 +216,71 @@ export function refineRoundedCorners(pathData, {
 
                     // not in tolerance – return original command
                     if (bezThresh && dist1 > bezThresh && dist1 > len3 * 0.3) {
-                        //renderPoint(markers, ptM_bez, 'cyan', '0.5%', '0.5')
-                        //renderPoint(markers, ptQ, 'magenta', '0.5%', '0.5')
                         pathDataN.push(com);
                         continue;
 
-                    } else {
+                    }
 
-                        //renderPoint(markers, ptQ, 'magenta', '0.5%', '0.5')
-                        let comQ = { type: 'Q', values: [ptQ.x, ptQ.y, comL1.p0.x, comL1.p0.y] }
-                        comQ.p0 = comL0.p;
-                        comQ.cp1 = ptQ;
-                        comQ.p = comL1.p0;
+                    // return simplified quadratic Bézier command
+                    let p_Q = comL1.p0;
 
-                        // add quadratic command
-                        pathDataN.push(comL0, comQ);
-                        i += offset;
-                        //i++
+                    // adjust previous end point to better fit the cubic curvature
+                    let adjustQ = !simplifyQuadraticCorners;
+
+
+                    if (adjustQ) {
+                        //let t = 0.1333
+                        let t = 0.1666
+                        let p0_adj = interpolate(ptQ, comL0.p, (1 + t))
+                        p_Q = interpolate(ptQ, comL1.p0, (1 + t))
+
+                        // round for large enough segments
+                        let isH = ptQ.y===comL0.p.y
+                        let isV = ptQ.x===comL0.p.x
+                        let isH2 = ptQ.y===comL1.p0.y
+                        let isV2 = ptQ.x===comL1.p0.x
+
+                        if(isSquare && com.dimA>3){
+                            let dec = 0.5;
+                            if(isH) p0_adj.x = roundTo(p0_adj.x, dec)
+                            if(isV) p0_adj.y = roundTo(p0_adj.y, dec)
+                            if(isH2) p_Q.x = roundTo(p_Q.x, dec)
+                            if(isV2) p_Q.y = roundTo(p_Q.y, dec)
+                        }
+
+
+                        /*
+                        renderPoint(markers, p0_adj, 'orange')
+                        renderPoint(markers, p_Q, 'orange')
+                        renderPoint(markers, comL0.p, 'green')
+                        renderPoint(markers, comL1.p0, 'magenta')
+                        */
+
+                        // set new M starting point
+                        if (i === l - lastOff - 1) {
+                            //renderPoint(markers, p0_adj, 'red')
+                            M_adj = p_Q
+                        }
+
+                        // adjust previous lineto end point
+                        comL0.values = [p0_adj.x, p0_adj.y]
+                        comL0.p = p0_adj;
 
-                        //offset++
-                        continue;
                     }
 
+                    let comQ = { type: 'Q', values: [ptQ.x, ptQ.y, p_Q.x, p_Q.y] }
+                    comQ.cp1 = ptQ;
+                    comQ.p0 = comL0.p;
+                    comQ.p = p_Q;
+
+                    // add quadratic command
+                    pathDataN.push(comL0, comQ);
+
+
+
+                    i += offset;
+                    continue;
+
                 }
             }
         }
@@ -203,6 +294,11 @@ export function refineRoundedCorners(pathData, {
 
     }
 
+    // correct starting point connecting with last corner rounding
+    if (M_adj) {
+        pathDataN[0].values = [M_adj.x, M_adj.y]
+        pathDataN[0].p0 = M_adj;
+    }
 
 
     // revert close path normalization
@@ -210,7 +306,6 @@ export function refineRoundedCorners(pathData, {
         pathDataN.push({ type: 'Z', values: [] })
     }
 
-
     //console.log(pathDataN);
 
     return pathDataN;