svg-path-simplify 0.4.1 → 0.4.3

package/src/svgii/pathData_stringify.js

@@ -4,22 +4,24 @@
 * d attribute string 
 */
 
-export function pathDataToD(pathData, optimize = 0) {
-
-    optimize = parseFloat(optimize)
-
-
+export function pathDataToD(pathData, mode = 0) {
+
+    mode = parseFloat(mode)
+    /*
+    0 = max minification
+    0.5 = safe
+    1 = verbose
+    2 = beautify
+    */
     let len = pathData.length;
-    let beautify = optimize > 1;
-    let minify = beautify || optimize ? false : true;
 
-
-    let d = '';
     let valsString = pathData[0].values.join(" ");
-    let separator_command = beautify ? `\n` : (minify ? '' : ' ');
-    let separator_type = !minify ? ' ' : '';
+    let separator_command = mode > 1 ? `\n` :
+        ((mode < 1) ? '' : ' ');
+    let separator_type = mode > 0.5 ? ' ' : '';
 
-    d = `${pathData[0].type}${separator_type}${valsString}${separator_command}`;
+    // 1st command
+    let d = `${pathData[0].type}${separator_type}${valsString}${separator_command}`;
 
 
     for (let i = 1; i < len; i++) {
@@ -29,7 +31,7 @@ export function pathDataToD(pathData, optimize = 0) {
         valsString = '';
 
         // Minify Arc commands (A/a) – actually sucks!
-        if (minify && (type === 'A' || type === 'a')) {
+        if (!mode && (type === 'A' || type === 'a')) {
             values = [
                 values[0], values[1], values[2],
                 `${values[3]}${values[4]}${values[5]}`,
@@ -38,16 +40,15 @@ export function pathDataToD(pathData, optimize = 0) {
         }
 
         // Omit type for repeated commands
-        type = (minify && com0.type === com.type && com.type.toLowerCase() !== 'm')
+        type = ((mode < 1) && com0.type === com.type && com.type.toLowerCase() !== 'm')
             ? " "
-            : (minify && com0.type === "M" && com.type === "L"
+            : ((mode < 1) && com0.type === "M" && com.type === "L"
                 ? " "
                 : com.type);
 
 
         // concatenate subsequent floating point values
-        if (minify) {
-
+        if (!mode) {
 
             let prevWasFloat = false;
 
@@ -67,71 +68,32 @@ export function pathDataToD(pathData, optimize = 0) {
                 if (v > 0 && !(prevWasFloat && isSmallFloat)) {
                     valsString += ' ';
                 }
-                //console.log(isSmallFloat, prevWasFloat, valStr);
 
                 valsString += valStr
                 prevWasFloat = isSmallFloat;
             }
 
-            //console.log('minify', valsString);
-            d += `${type}${separator_type}${valsString}${separator_command}`;
-
         }
         // regular non-minified output
         else {
-            d += `${type}${separator_type}${values.join(' ')}${separator_command}`;
+            valsString = values.join(' ')
         }
+
+        if(i===len-1) separator_command=''
+        d += `${type}${separator_type}${valsString}${separator_command}`;
     }
 
-    if (minify) {
+
+    if (mode < 1) {
         d = d
             .replace(/[A-Za-z]0(?=\.)/g, m => m[0])
             .replace(/ 0\./g, " .") // Space before small decimals
             .replace(/ -/g, "-")     // Remove space before negatives
             .replace(/-0\./g, "-.")  // Remove leading zero from negative decimals
-            .replace(/Z/g, "z");     // Convert uppercase 'Z' to lowercase
-    }
-
-    return d;
-}
-
-
-export function pathDataToD_0(pathData, decimals = -1, minify = false) {
-    // implicit l command
-    if (pathData[1].type === "l" && minify) {
-        pathData[0].type = "m";
-    }
-    let d = `${pathData[0].type}${pathData[0].values.join(" ")}`;
-
-    for (let i = 1; i < pathData.length; i++) {
-        let com0 = pathData[i - 1];
-        let com = pathData[i];
-
-        let type = (com0.type === com.type && minify) ?
-            " " : (
-                (com0.type === "m" && com.type === "l") ||
-                (com0.type === "M" && com.type === "l") ||
-                (com0.type === "M" && com.type === "L")
-            ) && minify ?
-                " " : com.type;
-
-        // round
-        if (com.values.length && decimals > -1) {
-            com.values = com.values.map(val => { return +val.toFixed(decimals) })
-        }
-        d += `${type}${com.values.join(" ")}`;
+            .replace(/Z/g, "z")    // Convert uppercase 'Z' to lowercase
     }
 
-
-    if (minify) {
-        d = d
-            .replaceAll(" 0.", " .")
-            .replaceAll(" -", "-")
-            .replaceAll("-0.", "-.")
-            .replace(/\s+([mlcsqtahvz])/gi, "$1")
-            .replaceAll("Z", "z");
-    }
+    //console.log(`"${d}"`);
 
     return d;
 }
-

package/src/svgii/pathData_toPolygon.js

@@ -21,7 +21,7 @@ import { renderPoint } from "./visualize";
  * creates precise polygon approximation from pathdata
  * converts arc to cubis
  */
-export function pathDataToPolygon(pathData, {
+export function pathDataToPolygonOpt(pathData, {
     precisionPoly = 1,
     autoAccuracy=false,
     polyFormat='points',
@@ -105,12 +105,12 @@ simplifyRDP=1,
 
     // simplify polygon
     if(simplifyRD>0){
-        pts2 = simplifyPolyRD(pts2, {quality:simplifyRD+'px'})
+        pts2 = simplifyPolyRD(pts2, {quality:simplifyRD})
     }
 
 
     if(simplifyRDP>0){
-        pts2 = simplifyPolyRDP(pts2, {quality:simplifyRDP+'px'})
+        pts2 = simplifyPolyRDP(pts2, {quality:simplifyRDP})
     }
 
 
@@ -120,7 +120,6 @@ simplifyRDP=1,
     
     if(autoAccuracy){
         decimals = detectAccuracyPoly(pts)
-        //console.log('decimals', decimals);
     }
 
     let poly = decimals>-1 ? pts2.map(pt => { return { x: roundTo(pt.x, decimals), y: roundTo(pt.y, decimals) } }) : pts2.map(pt => { return { x: pt.x, y: pt.y } })

package/src/svgii/poly_analyze.js

@@ -9,6 +9,67 @@ import { pathDataToD } from "./pathData_stringify";
 import { renderPath, renderPoint, renderPoly } from "./visualize";
 
 
+export function getPolyCentroid(pts) {
+
+    let l = pts.length;
+    let x = 0, y = 0;
+    for (let i = 0; l && i < l; i++) {
+        let pt = pts[i];
+        x += pt.x
+        y += pt.y
+    }
+
+    let centroid = {x: x/l, y:y/l}
+    return centroid
+    //console.log(centroid);
+
+}
+
+export function getPolyCentroidWeighted(points) {
+    if (!points || points.length === 0) return null;
+    
+    let totalWeight = 0;
+    let sumX = 0;
+    let sumY = 0;
+    
+    for (const point of points) {
+        let weight = point.weight || 1; // default weight = 1
+        sumX += point.x * weight;
+        sumY += point.y * weight;
+        totalWeight += weight;
+    }
+    
+    if (totalWeight === 0) return null;
+    
+    return {
+        x: sumX / totalWeight,
+        y: sumY / totalWeight
+    };
+}
+
+
+
+export function detectRegularPolygon(pts, centroid={x:0, y:0}) {
+    let rSq = getSquareDistance(pts[0], centroid);
+    let isRegular = true;
+
+    for (let i = 1, l = pts.length; i < l; i++) {
+        let pt1 = pts[i];
+        let dist = getSquareDistance(pt1, centroid);
+
+        let diff = Math.abs(rSq-dist);
+        let diffRel = diff/rSq
+        //console.log('diffRel', diffRel);
+
+        if (diffRel > 0.05) {
+            return false;
+        }
+
+
+    }
+    return isRegular;
+}
+
 
 export function analyzePoly(pts, {
     x = 0,

package/src/svgii/poly_normalize.js

@@ -64,8 +64,17 @@ export function polyPtsToArray(pts) {
 // convert flat point value array to point object array
 export function toPointArray(pts) {
     let ptArr = [];
-    for (let i = 1, l = pts.length; i < l; i += 2) {
-        ptArr.push({ x: pts[i - 1], y: pts[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] });
+        }
+
+    }else{
+        for (let i = 1, l = pts.length; i < l; i += 2) {
+            ptArr.push({ x: pts[i - 1], y: pts[i] });
+        }
     }
     return ptArr;
 };

package/src/svgii/poly_to_pathdata.js

@@ -5,15 +5,19 @@
 * https://francoisromain.medium.com/smooth-a-svg-path-with-cubic-bezier-curves-e37b49d46c74
 */
 
-import { checkLineIntersection, getDistManhattan, interpolate, mirrorCpts } from "./geometry";
+import { checkLineIntersection, getAngle, getDistance, getDistManhattan, getPathDataVertices, getPointOnEllipse, getSquareDistance, interpolate, mirrorCpts, reducePoints, rotatePoint } from "./geometry";
 import { getPolyBBox } from "./geometry_bbox";
 import { renderPath, renderPoint, renderPoly } from "./visualize";
 import { simplifyPolyRDP } from "../simplify_poly_RDP";
 import { pathDataFromPoly } from "./pathData_fromPoly";
 import { getPolyChunks } from "./poly_analyze_get_chunks";
-import { analyzePoly, isClosedPolygon } from "./poly_analyze";
+import { analyzePoly, detectRegularPolygon, getPolyCentroid, getPolyCentroidWeighted, isClosedPolygon } from "./poly_analyze";
 import { fitCurveSchneider } from "../poly-fit-curve-schneider";
 import { simplifyPolyRD } from "../simplify_poly_radial_distance";
+import { simplifyRC } from "../simplify_poly_RC";
+import { getPolygonArea } from "./geometry_area";
+import { pathDataToD } from "./pathData_stringify";
+import { fixIntersectingCpts } from "../pathData_simplify_harmonize_cpts";
 
 
 
@@ -34,34 +38,89 @@ export function simplifyPolygonToPathData(pts, {
 } = {}) {
 
 
+    let polyPath = [];
+    let l = pts.length;
+    let M = pts[0]
+    let Z = pts[l - 1]
+
+
+    // triangle
+    if (pts.length === 3) {
+
+        let pM1 = interpolate(M, pts[1], 0.5)
+        let pM2 = interpolate(pts[1], Z, 0.5)
+        let pM3 = interpolate(Z, pts[0], 0.5)
+
+        /*
+        console.log('triangle');
+        renderPoint(markers, M)
+        renderPoint(markers, pM1)
+        renderPoint(markers, pM2)
+        renderPoint(markers, pM3)
+        */
+
+        if (closed) {
+            let t = 0.6666
+            let cp1_1 = interpolate(pM1, pts[1], t)
+            let cp2_1 = interpolate(pM2, pts[1], t)
+            let cp1_2 = interpolate(pM2, Z, t)
+            let cp2_2 = interpolate(pM3, Z, t)
+            let cp1_3 = interpolate(pM3, M, t)
+            let cp2_3 = interpolate(pM1, M, t)
+
+            polyPath = [
+                { type: 'M', values: [pM1.x, pM1.y] },
+                { type: 'C', values: [cp1_1.x, cp1_1.y, cp2_1.x, cp2_1.y, pM2.x, pM2.y] },
+                { type: 'C', values: [cp1_2.x, cp1_2.y, cp2_2.x, cp2_2.y, pM3.x, pM3.y] },
+                { type: 'C', values: [cp1_3.x, cp1_3.y, cp2_3.x, cp2_3.y, pM1.x, pM1.y] },
+                { type: 'Z', values: [] },
+            ]
 
-    /*
-    // denoise via RDP
-    if (denoise && denoise !== 1) {
-        pts = simplifyPolyRDP(pts, {
-            width,
-            height,
-            quality: denoise,
-            manhattan,
-            absolute
-        })
+        } else {
+            polyPath = [
+                //{ type: 'M', values: [pM1.x, pM1.y] },
+                { type: 'M', values: [M.x, M.y] },
+                { type: 'C', values: [pts[1].x, pts[1].y, pts[1].x, pts[1].y, Z.x, Z.y] },
+            ]
+        }
+        return polyPath;
     }
-    */
 
 
-    /*
-    // simplify polygon
-    if (simplifyRD != 1) {
-        pts = simplifyPolyRD(pts, { quality: simplifyRD+'px' })
-    }
+
+    // remove colinear
+    //pts = simplifyRC(pts)
+
+    /**
+     * detect regular polygon
+     * curved path is a circle
+     */
+    let centroid = getPolyCentroid(simplifyRC(pts))
+    let isRegularPolygon = detectRegularPolygon(pts, centroid)
 
 
-    if (simplifyRDP != 1) {
-        pts = simplifyPolyRDP(pts, { quality: simplifyRDP+'px' })
+    if (isRegularPolygon) {
+        //renderPoint(markers, centroid)
+        //let r = getDistance(centroid, pts[0])
+        let ptAd = rotatePoint(pts[0], centroid.x, centroid.y, Math.PI)
+        let sweep = getPolygonArea(pts) > 0 ? 1 : 0;
+
+        polyPath = [
+            { type: 'M', values: [pts[0].x, pts[0].y] },
+            { type: 'A', values: [1, 1, 0, 0, sweep, ptAd.x, ptAd.y] },
+            { type: 'A', values: [1, 1, 0, 0, sweep, pts[0].x, pts[0].y] }
+        ]
+
+        if (closed) {
+            polyPath.push({ type: 'Z', values: [] })
+        }
+        return polyPath;
     }
-    */
 
 
+    // remove colinear
+    //pts = simplifyRC(pts)
+
     // get topology of poly
     let polyAnalyzed = !keepExtremes && !keepCorners ? pts : analyzePoly(pts, {
         debug: false
@@ -70,7 +129,6 @@ export function simplifyPolygonToPathData(pts, {
     })
 
     //console.log(polyAnalyzed, polyAnalyzed2);
-    //return
 
     // split into segment chunks
     let chunks = !keepExtremes && !keepCorners ? [polyAnalyzed] : getPolyChunks(polyAnalyzed, { keepCorners, keepExtremes, keepInflections });
@@ -81,12 +139,15 @@ export function simplifyPolygonToPathData(pts, {
 
     //threshold = 2
 
-    let polyPath = simplifyPolyChunks(chunks, {
+    polyPath = simplifyPolyChunks(chunks, {
         closed,
         tolerance: threshold,
-        keepCorners
+        keepCorners,
+        keepExtremes: true,
     });
 
+    polyPath = fixIntersectingCpts(polyPath);
+
     return polyPath;
 }
 

package/src/svgii/rounding.js

@@ -72,7 +72,7 @@ export function detectAccuracy(pathData) {
     let dim_min = dims.sort()
     //console.log('dim_min', dim_min);
 
-    let sliceIdx = Math.ceil(dim_min.length / 8);
+    let sliceIdx = Math.ceil(dim_min.length / 6);
     dim_min = dim_min.slice(0, sliceIdx);
     let minVal = dim_min.reduce((a, b) => a + b, 0) / sliceIdx;
 
@@ -88,6 +88,7 @@ export function detectAccuracy(pathData) {
 
 
 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;
@@ -98,20 +99,20 @@ export function roundTo(num = 0, decimals = 3) {
  * floating point accuracy 
  * based on numeric value
  */
-export function autoRound(val, integerThresh = 10){
+export function autoRound(val, integerThresh = 50){
   let decimals=8;  
-
-  //console.log('val', val);
   
-  if(val>integerThresh){
+  if(val>integerThresh*2){
     decimals=0
   }
-  else if(val>5){
+  else if(val>integerThresh){
     decimals=1
   }else{
-     decimals=Math.ceil(integerThresh/val).toString().length
+     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;
 }

package/src/svgii/svg-styles-to-attributes-const.js

@@ -19,6 +19,7 @@ export const transHorizontal = ['scaleX', 'translateX', 'skewX'];
 export const transVertical = ['scaleY', 'translateY', 'skewY'];
 
 export const colorProps = ['fill', 'stroke', 'stop-color'];
+export const geometryProps = ['d', 'points', 'cx', 'cy', 'x1', 'x2', 'y1', 'y2', 'width', 'height', 'r', 'rx', 'ry', 'x', 'y'];
 
 
 export const geometryEls = [