Add boolean operations (#1759)

This commit is contained in:
Keavon Chambers
2024-05-25 22:02:00 -07:00
committed by GitHub
parent c80de41d28
commit d40fb6caad
19 changed files with 409 additions and 55 deletions

View File

@@ -0,0 +1,34 @@
import paper from "paper/dist/paper-core";
// Required setup to be used headlessly
paper.setup(new paper.Size(1, 1));
paper.view.autoUpdate = false;
export function booleanUnion(path1: string, path2: string): string {
return booleanOperation(path1, path2, "unite");
}
export function booleanSubtract(path1: string, path2: string): string {
return booleanOperation(path1, path2, "subtract");
}
export function booleanIntersect(path1: string, path2: string): string {
return booleanOperation(path1, path2, "intersect");
}
export function booleanDifference(path1: string, path2: string): string {
return booleanOperation(path1, path2, "exclude");
}
export function booleanDivide(path1: string, path2: string): string {
return booleanOperation(path1, path2, "intersect") + booleanOperation(path1, path2, "exclude");
}
function booleanOperation(path1: string, path2: string, operation: "unite" | "subtract" | "intersect" | "exclude"): string {
const paperPath1 = new paper.Path(path1);
const paperPath2 = new paper.Path(path2);
const result = paperPath1[operation](paperPath2);
paperPath1.remove();
paperPath2.remove();
return result.pathData;
}

View File

@@ -97,6 +97,7 @@ import AlignTop from "@graphite-frontend/assets/icon-16px-solid/align-top.svg";
import AlignVerticalCenter from "@graphite-frontend/assets/icon-16px-solid/align-vertical-center.svg";
import Artboard from "@graphite-frontend/assets/icon-16px-solid/artboard.svg";
import BooleanDifference from "@graphite-frontend/assets/icon-16px-solid/boolean-difference.svg";
import BooleanDivide from "@graphite-frontend/assets/icon-16px-solid/boolean-divide.svg";
import BooleanIntersect from "@graphite-frontend/assets/icon-16px-solid/boolean-intersect.svg";
import BooleanSubtractBack from "@graphite-frontend/assets/icon-16px-solid/boolean-subtract-back.svg";
import BooleanSubtractFront from "@graphite-frontend/assets/icon-16px-solid/boolean-subtract-front.svg";
@@ -171,6 +172,7 @@ const SOLID_16PX = {
AlignVerticalCenter: { svg: AlignVerticalCenter, size: 16 },
Artboard: { svg: Artboard, size: 16 },
BooleanDifference: { svg: BooleanDifference, size: 16 },
BooleanDivide: { svg: BooleanDivide, size: 16 },
BooleanIntersect: { svg: BooleanIntersect, size: 16 },
BooleanSubtractBack: { svg: BooleanSubtractBack, size: 16 },
BooleanSubtractFront: { svg: BooleanSubtractFront, size: 16 },