svg-path-simplify 0.4.5 → 0.4.6

package/src/svgii/poly_to_pathdata.js

@@ -18,6 +18,8 @@ import { simplifyRC } from "../simplify_poly_RC";
 import { getPolygonArea } from "./geometry_area";
 import { pathDataToD } from "./pathData_stringify";
 import { fixIntersectingCpts } from "../pathData_simplify_harmonize_cpts";
+import { convertPathData } from "./pathData_convert";
+import { combineCubicPairs } from "../pathData_simplify_cubic";
 
 
 
@@ -35,6 +37,7 @@ export function simplifyPolygonToPathData(pts, {
     tolerance = 1,
     simplifyRD = 1,
     simplifyRDP = 1,
+    isClosed = true,
 } = {}) {
 
 
@@ -121,6 +124,28 @@ export function simplifyPolygonToPathData(pts, {
     // remove colinear
     //pts = simplifyRC(pts)
 
+    keepExtremes = false;
+    keepCorners = false;
+
+    keepExtremes = true;
+    keepCorners = true;
+
+    // check if closed
+    /*
+    let bb = getPolyBBox(pts)
+    let thresh = (bb.width+bb.height)*0.25
+    let dist0 = getDistManhattan(pts[0], pts[pts.length-1])
+
+    //let isClosed = dist0<=thresh;
+    //isClosed = false;
+    //console.log('isClosed', isClosed, 'dist0', dist0, thresh);
+    */
+
+    // copy 1st first to end
+    if (isClosed) {
+        pts.push(pts[0])
+    }
+
     // get topology of poly
     let polyAnalyzed = !keepExtremes && !keepCorners ? pts : analyzePoly(pts, {
         debug: false
@@ -131,27 +156,471 @@ export function simplifyPolygonToPathData(pts, {
     //console.log(polyAnalyzed, polyAnalyzed2);
 
     // split into segment chunks
-    let chunks = !keepExtremes && !keepCorners ? [polyAnalyzed] : getPolyChunks(polyAnalyzed, { keepCorners, keepExtremes, keepInflections });
+    //let chunks = !keepExtremes && !keepCorners ? [polyAnalyzed] : getPolyChunks(polyAnalyzed, { keepCorners, keepExtremes, keepInflections });
+
+    let chunks = getPolyChunks(polyAnalyzed, { keepCorners, keepExtremes, keepInflections: true });
 
 
     // Schneider curve fit
     let threshold = width && height ? (width + height) / 2 * 0.004 * tolerance : 2.5
+    threshold = width && height ? (width + height) / 2 * 0.004 * tolerance : 2.5
+    // console.log('tolerance', tolerance, threshold);
+
 
     //threshold = 2
+    let useToplogy = true
+
+    if (useToplogy) {
+
+        polyPath = simplifyPolyChunksTopology(chunks, {
+            closed,
+            tolerance: threshold,
+            keepCorners,
+            keepExtremes: true,
+        });
+    } else {
+
+        polyPath = simplifyPolyChunks(chunks, {
+            closed,
+            tolerance: threshold,
+            keepCorners,
+            keepExtremes: true,
+        });
+    }
+
 
-    polyPath = simplifyPolyChunks(chunks, {
-        closed,
-        tolerance: threshold,
-        keepCorners,
-        keepExtremes: true,
-    });
 
-    polyPath = fixIntersectingCpts(polyPath);
+
+    //polyPath = fixIntersectingCpts(polyPath);
 
     return polyPath;
 }
 
 
+/**
+ * topology based curve fit
+ */
+export function simplifyPolyChunksTopology(chunks = [], {
+    closed = true,
+    keepCorners = true,
+    tolerance = 1,
+} = {}) {
+
+    console.log(chunks);
+
+
+    let l = chunks.length;
+
+    // new pathData
+    //let M = {x:chunks[0][0].x}
+    let pathData = [{ type: 'M', values: [chunks[0][0].x, chunks[0][0].y] }]
+
+    // loop chunks
+    for (let i = 0; i < l; i++) {
+
+        let chunkPrev = i > 0 ? chunks[i - 1] : (closed ? chunks[l - 1] : null);
+        let chunk = chunks[i];
+        let chunkN = chunks[i + 1] ? chunks[i + 1] : (closed ? chunks[0] : null)
+        let segments = []
+
+        // add from next command
+        if (chunkN) {
+            chunk.push(chunkN[0])
+        }
+
+        let chunklen = chunk.length
+        let hasInflection = false;
+        let segments_1 = [], segments_2 = [], segments_3 = [];
+        let segsRequired = 3;
+
+        // 1st point
+        let p1 = chunk[0]
+        // last point in chunk
+        let p2 = chunk[chunklen - 1]
+        let isLinetoSeg = false
+
+        // nothing to simplify - lineto
+
+        // if (chunklen < 2 || (chunklen === 2 && (chunk[1].isExtreme || i===l-1 && !closed)  )) {
+
+
+
+        if (chunklen < 2 || (chunklen === 2 && (chunk[1].isExtreme))) {
+            //segments_1 = chunk.map(com => { return { type: 'L', values: [com.x, com.y] } })
+
+            isLinetoSeg = true
+
+            if (chunklen === 2) {
+                segsRequired = 2;
+                segments_2 = [
+                    {
+                        type: 'L',
+                        values: [p1.x, p1.y],
+                        p0: chunkPrev,
+                        p: p1,
+                    },
+                    {
+                        type: 'L',
+                        values: [chunk[1].x, chunk[1].y],
+                        p0: p1,
+                        p: p2,
+                    }
+                ]
+            } else {
+                segsRequired = 1;
+                segments_1 = [
+                    {
+                        type: 'L',
+                        values: [p1.x, p1.y],
+                        p0: chunkPrev,
+                        p: p2,
+                    },
+                ]
+            }
+
+        } else {
+            //renderPoint(markers, chunk[0], 'green')
+
+            // point before inflection
+            let p3 = chunk[chunklen - 2];
+
+
+            let extremes = chunk.filter(pt => pt.isExtreme)
+            let semiExtremes = chunk.filter(pt => pt.isSemiExtreme)
+            let corners = chunk.filter(pt => pt.isCorner)
+            let inflections = chunk.filter(pt => pt.isDirChange && !pt.isCorner && !pt.isExtreme)
+            hasInflection = inflections.length && inflections[0] !== p1
+
+
+            let idxMid = Math.floor(chunklen * 0.5)
+            let pMid = semiExtremes.length ? semiExtremes[Math.floor(semiExtremes.length * 0.5)] : chunk[idxMid]
+
+            //check if mid is close to end 
+            let dist0 = getDistManhattan(p1, p3)
+            let dist1 = getDistManhattan(pMid, p3)
+            let dist2 = getDistManhattan(pMid, p1)
+            let thresh = dist0 * 0.25
+            let shortMidSegment = dist1 < thresh || dist2 < thresh
+
+
+            /**
+             * we have 3 modes
+             * 1 segment: only 1 segment between extremes/corners
+             * 2 segments: semiextreme/mid in between
+             * 3 segments: inflection
+             */
+
+            segsRequired = shortMidSegment ? (!hasInflection ? 1 : 2) : (hasInflection ? 3 : 2)
+
+            //if(shortMidSegment){renderPoint(markers, pMid, 'red', '2%')}
+            let cp1_1 = p1.tangentR;
+            let cp2_1 = pMid.tangentL;
+            let p_1 = pMid
+
+            // renderPoint(markers, pMid, 'orange', '2%')
+
+            let cp2_2 = p2.tangentL;
+            let cp1_2 = pMid.tangentR;
+            let p_2 = p2
+
+            let cp1_3 = null
+            let cp2_3 = null
+            let p_3 = null
+
+            // general extrapolation
+            let t = 0.666;
+            let d = ''
+            let ptI_1 = null, ptI_2 = null, ptI_3 = null;
+
+
+            // 1 segment
+            ptI_1 = checkLineIntersection(p1, p1.tangentR, p2, p2.tangentL, false, true)
+            if (ptI_1) {
+                cp1_1 = interpolate(p1, ptI_1, t)
+                cp2_1 = interpolate(p2, ptI_1, t)
+                p_1 = p2;
+
+                segments_1 = [
+                    //{type: 'M', values: [p1.x, p1.y]},
+                    {
+                        type: 'C',
+                        values: [cp1_1.x, cp1_1.y, cp2_1.x, cp2_1.y, p_1.x, p_1.y],
+                        p0: p1,
+                        cp1: cp1_1,
+                        cp2: cp2_1,
+                        p: p_1,
+                    }
+                ];
+
+                //d = pathDataToD( [{ type: 'M', values: [p1.x, p1.y] },...segments_1])
+                //renderPath(markers, d)
+                //console.log(d);
+            }
+
+
+            // 2 segments
+            ptI_1 = checkLineIntersection(p1, p1.tangentR, pMid, pMid.tangentL, false, true)
+            ptI_2 = checkLineIntersection(p2, p2.tangentL, pMid, pMid.tangentR, false, true)
+
+            if (ptI_1 && ptI_2) {
+                cp1_1 = interpolate(p1, ptI_1, t)
+                cp2_1 = interpolate(pMid, ptI_1, t)
+                p_1 = pMid
+
+                cp1_2 = interpolate(pMid, ptI_2, t)
+                cp2_2 = interpolate(p2, ptI_2, t)
+                p_2 = p2
+
+                segments_2 = [
+                    //{type: 'M', values: [p1.x, p1.y]},
+                    {
+                        type: 'C',
+                        values: [cp1_1.x, cp1_1.y, cp2_1.x, cp2_1.y, p_1.x, p_1.y],
+                        p0: p1,
+                        cp1: cp1_1,
+                        cp2: cp2_1,
+                        p: p_1,
+                        isExtreme: p_1.isExtreme
+                    },
+                    {
+                        type: 'C',
+                        values: [cp1_2.x, cp1_2.y, cp2_2.x, cp2_2.y, p_2.x, p_2.y],
+                        p0: p_1,
+                        cp1: cp1_2,
+                        cp2: cp2_2,
+                        p: p_2,
+                        isExtreme: p_2.isExtreme
+
+                        //isExtreme: true
+                    },
+                ];
+
+                //d = pathDataToD( [{ type: 'M', values: [p1.x, p1.y] },...segments_2])
+                //renderPath(markers, d)
+
+            }
+
+
+            // 3 segments
+            //hasInflection=true
+            if (hasInflection) {
+
+                // get pt between dir change and mid
+                let idx_3_4 = Math.floor(chunklen * 0.75)
+                p3 = chunk[idx_3_4]
+                ptI_3 = checkLineIntersection(p3, p3.tangentR, p2, p2.tangentL, false, false)
+
+                if (ptI_3) {
+                    let tangentR_beforeDirChange = interpolate(p3, ptI_3, t)
+
+                    // extend right tangent
+                    p3.tangentR.x = tangentR_beforeDirChange.x
+                    p3.tangentR.y = tangentR_beforeDirChange.y
+
+                    // extend dir change tangent
+                    let tangentL_dirChange = interpolate(p2, ptI_3, t)
+                    p2.tangentL.x = tangentL_dirChange.x
+                    p2.tangentL.y = tangentL_dirChange.y
+                } else {
+
+                    if (p3 === p2) {
+
+                        idx_3_4 = Math.floor(chunklen * 0.3)
+                        p3 = chunk[idx_3_4]
+
+                        //renderPoint(markers, p2, 'purple', '3%')
+                        //renderPoint(markers, p3, 'orange', '2%')
+
+                    }
+                    let ptI_4 = checkLineIntersection(p3, p3.tangentR, p2, p2.tangentL, false, false)
+                    //renderPoint(markers, ptI_4, 'orange', '2%')
+                    //renderPoint(markers, p3, 'blue', '1%')
+                    //renderPoint(markers, p1, 'magenta', '2%')
+
+                    //let ptI_4 = checkLineIntersection(p3, p3.tangentL, p1, p1.tangentR, false, false)
+                    //renderPoint(markers, ptI_4, 'blue', '1%')
+
+
+                    //cp1_1 = interpolate(p1, ptI_4, t )
+                    //cp2_1 = interpolate(p1, ptI_4, t )
+
+                    cp1_1 = interpolate(p1, p1.tangentR, 1.333)
+                    cp2_1 = interpolate(p2, p2.tangentL, 1.333)
+
+
+                    segments_3 = [
+                        {
+                            type: 'C',
+                            values: [cp1_1.x, cp1_1.y, cp2_1.x, cp2_1.y, p2.x, p2.y],
+                            p0: p1,
+                            cp1: cp1_1,
+                            cp2: cp2_1,
+                            p: p2,
+                            isExtreme: p2.isExtreme
+                            //isExtreme: true
+                        },
+                    ];
+
+
+                    //let ptI_4 = checkLineIntersection(p2, p2.tangentL, p2, p2.tangentL, false, false)
+                    //renderPoint(markers, ptI_3, 'orange', '2%')
+
+                    /*
+                    let tangentR_beforeDirChange = interpolate(p3, ptI_3, t)
+
+                    // extend right tangent
+                    p3.tangentR.x = tangentR_beforeDirChange.x
+                    p3.tangentR.y = tangentR_beforeDirChange.y
+
+                    let tangentL_dirChange = interpolate(p2, ptI_3, t)
+                    p2.tangentL.x = tangentL_dirChange.x
+                    p2.tangentL.y = tangentL_dirChange.y
+                    */
+
+                    d = pathDataToD([{ type: 'M', values: [p1.x, p1.y] }, ...segments_3])
+                    //renderPath(markers, d)
+
+                }
+
+
+
+                cp1_3 = p3.tangentR
+                cp2_3 = p2.tangentL
+                p_3 = p2
+
+                ptI_1 = checkLineIntersection(p1, p1.tangentR, pMid, pMid.tangentL, false, true)
+                ptI_2 = checkLineIntersection(pMid, pMid.tangentR, p3, p3.tangentL, false, true)
+
+                if (!ptI_3) {
+                    //console.log(chunk, pMid, pMid.tangentR, 'p3', p3, p3.tangentL);
+                }
+
+                if (ptI_1 && ptI_2 && ptI_3) {
+
+                    cp1_1 = interpolate(p1, ptI_1, t)
+                    cp2_1 = interpolate(pMid, ptI_1, t)
+                    p_1 = pMid
+
+                    cp1_2 = interpolate(pMid, ptI_2, t)
+                    cp2_2 = interpolate(p3, ptI_2, t)
+                    p_2 = p3
+
+                    segments_3 = [
+                        {
+                            type: 'C',
+                            values: [cp1_1.x, cp1_1.y, cp2_1.x, cp2_1.y, p_1.x, p_1.y],
+                            p0: p1,
+                            cp1: cp1_1,
+                            cp2: cp2_1,
+                            p: p_1,
+                            isExtreme: p_1.isExtreme
+                            //isExtreme: true
+                        },
+                        {
+                            type: 'C',
+                            values: [cp1_2.x, cp1_2.y, cp2_2.x, cp2_2.y, p_2.x, p_2.y],
+                            p0: p_1,
+                            cp1: cp1_2,
+                            cp2: cp2_2,
+                            p: p_2,
+                        },
+                        {
+                            type: 'C',
+                            values: [cp1_3.x, cp1_3.y, cp2_3.x, cp2_3.y, p_3.x, p_3.y],
+                            p0: p_2,
+                            cp1: cp1_3,
+                            cp2: cp2_3,
+                            p: p_3,
+                            isExtreme: p_3.isExtreme
+                            //isExtreme: true
+                        }
+                    ];
+
+                    d = pathDataToD([{ type: 'M', values: [p1.x, p1.y] }, ...segments_3])
+                    //renderPath(markers, d)
+
+
+                } else {
+                    //console.log('incomplete', ptI_1, ptI_2, ptI_3);
+                }
+
+            }
+
+            //console.log('chunk', chunk, extremes, semiExtremes, corners, inflections);
+
+        }
+
+        if (segsRequired === 1) {
+            segments = segments_1
+        } else if (segsRequired === 2 && segments_2.length) {
+            segments = segments_2
+        }
+        else {
+        }
+
+        segments = segments_3.length ? segments_3 : segments_2
+        //segments = segments_2.length ? segments_2 : segments_3
+        //segments = segments_3
+
+
+        /**
+         * try simplification
+         */
+        let simplify = false
+        /*
+        if (simplify && !isLinetoSeg && segments.length > 1) {
+    
+            let com1 = segments[0]
+            let com2 = segments[1]
+    
+            tolerance = 1.1
+            let combined = combineCubicPairs(com1, com2, { tolerance })
+            //let error = combined[0].error;
+            let error = 0;
+            let comsSimp =[]
+    
+            console.log('!!!combined', segments.length, combined);
+    
+            // success
+            if (combined.length === 1) {
+    
+                if(segments.length === 2){
+                    segments = combined
+                }
+    
+                let com = combined[0]
+            }
+    
+        }
+        */
+
+        // remove first segment to connect to last segment
+        pathData.push(...segments)
+
+    }
+
+
+
+    if (closed) {
+        pathData.push({ type: 'Z', values: [] })
+    }
+    //console.log('!!!pathData from poly', pathData);
+
+
+    //pathData2 = convertPathData(pathData2, { toRelative: true, decimals: 5 });
+    //let d = pathDataToD(pathData2);
+    //renderPath(markers, d, 'green', '0.75%', '0.5')
+    //console.log(d);
+
+
+    // refine extremes
+    return pathData
+
+}
+
+
+
+
 /**
  * convert polygon chunks
  * to cubic beziers 

package/src/svgii/rounding.js

@@ -19,7 +19,7 @@ export function roundPathData(pathData, decimalsGlobal = -1) {
 
     let len = pathData.length;
     let decimals = decimalsGlobal
-    let decimalsArc = decimals < 3 ? decimals + 2 : decimals
+    let decimalsArc = decimals < 3 ? decimals + 1 : decimals
     //decimalsArc = decimals
     //console.log(decimalsArc);
 
@@ -64,7 +64,7 @@ export function detectAccuracyPoly(pts) {
         }
     }
 
-    let dim_min = dims.sort()
+    let dim_min = dims.sort((a,b)=>a-b)
     let sliceIdx = Math.ceil(dim_min.length / 8);
     dim_min = dim_min.slice(0, sliceIdx);
     let minVal = dim_min.reduce((a, b) => a + b, 0) / sliceIdx;
@@ -90,65 +90,55 @@ export function detectAccuracy(pathData) {
         let com = pathData[i];
         let { type, values, p0 = null, p = null, dimA = 0 } = com;
 
-        // use existing averave dimension value or calculate
+        // use existing average dimension value or calculate
         if (values.length && p && p0) {
-            //console.log(com);
             dimA = dimA ? dimA : getDistManhattan(p0, p);
 
-            //let dimA = +getDistAv(p0, p).toFixed(8)
-            //console.log('dimA', dimA, com.dimA, type);
+            //who would have thought we need an exception for arcs?
+            if (type === 'A') dimA *= 0.5
 
             if (dimA) dims.push(+dimA.toFixed(8));
-            //if (dimA) dims.push(dimA);
             if (dimA && dimA < minDim) minDim = dimA;
-            //if (dimA && dimA > maxDim) maxDim = dimA;
         }
 
     }
 
 
-   dims = dims.sort()
-   let len = dims.length;
-   let dim_mid = dims[Math.floor(len*0.5)]
-
-   // smallest 25% of values
-   let idx_q = Math.ceil(len*0.25);
-   let dims_min = dims.slice(0, idx_q);
-
-   // average smallest values with mid value
-   let dim_min = ((dims_min.reduce((a, b) => a + b, 0) / idx_q)  + dim_mid) * 0.5;
-
+    dims = dims.sort((a,b)=>a-b)
+    let len = dims.length;
+    let dim_mid = dims[Math.floor(len * 0.5)]
 
-   let threshold = 75
-   let decimalsAuto = dim_min > threshold * 1.5 ? 0 : Math.floor(threshold / dim_min).toString().length
+    // smallest 25% of values
+    let idx_q = Math.ceil(len * 0.25);
+    let dims_min = dims.slice(0, idx_q);
 
-   // clamp
-   return Math.min(Math.max(0, decimalsAuto), 8)
+    // average smallest values with mid value
+    let dim_min = ((dims_min.reduce((a, b) => a + b, 0) / idx_q) + dim_mid) * 0.5;
 
 
+    let threshold = 75
+    let decimalsAuto = dim_min > threshold * 1.5 ? 0 : Math.floor(threshold / dim_min).toString().length
 
-    /*
-    let dim_min = dims.sort()
-    //console.log('dim_min', dim_min);
-
-    let dim_mid = dim_min[Math.floor(dim_min.length*0.5)]
+    // clamp
+    return Math.min(Math.max(0, decimalsAuto), 8)
 
-    let sliceIdx = Math.ceil(dim_min.length / 4);
-    dim_min = dim_min.slice(0, sliceIdx);
-    let minVal = dim_min.reduce((a, b) => a + b, 0) / sliceIdx;
+}
 
-    // average with mid value
-    minVal = (minVal+dim_mid)*0.5
-    //console.log('minVal', minVal, dim_mid);
 
 
-    let threshold = 75
-    let decimalsAuto = minVal > threshold * 1.5 ? 0 : Math.floor(threshold / minVal).toString().length
+export function roundPoly(poly = [], decimals = 3) {
+    if (!poly.length || decimals < 0) return poly;
+    poly = poly.map(pt => roundPoint(pt, decimals));
+    return poly
+}
 
-    // clamp
-    return Math.min(Math.max(0, decimalsAuto), 8)
-    */
 
+export function roundPoint(pt = {}, decimals = 3) {
+    if (pt.x === undefined || pt.y === undefined || decimals < 0) return pt;
+    pt.x=roundTo(pt.x, decimals)
+    pt.y=roundTo(pt.y, decimals)
+    return pt
+    //return { x: roundTo(pt.x, decimals), y: roundTo(pt.y, decimals) }
 }
 
 /**