fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-10-01 16:38:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

Implement curvature function in Bezier math library (#725)

Browse Source 
* bezier curvature

* change comment

Co-authored-by: Jackie Chen <jackiechen73>
This commit is contained in:
Jackie Chen
2022-07-29 21:58:16 -04:00
committed by GitHub
co-authored by Jackie Chen
parent b4070f9c90
commit 18871e5bbf
4 changed files with 53 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
bezier-rs/docs/interactive-docs/src/App.vue
+21 -1
View File
@@ -25,7 +25,7 @@
<script lang="ts">
import { defineComponent, markRaw } from "vue";
import { drawBezier, drawBezierHelper, drawCurve, drawLine, drawPoint, drawText, getContextFromCanvas, COLORS } from "@/utils/drawing";
import { drawBezier, drawBezierHelper, drawCircle, drawCurve, drawLine, drawPoint, drawText, getContextFromCanvas, COLORS } from "@/utils/drawing";
import { BezierCurveType, Point, WasmBezierInstance, WasmSubpathInstance } from "@/utils/types";
import ExamplePane from "@/components/ExamplePane.vue";
@@ -205,6 +205,26 @@ export default defineComponent({
template: markRaw(SliderExample),
templateOptions: { sliders: [tSliderOptions] },
},
{
name: "Curvature",
callback: (canvas: HTMLCanvasElement, bezier: WasmBezierInstance, options: Record<string, number>): void => {
const context = getContextFromCanvas(canvas);
const point = JSON.parse(bezier.evaluate(options.t));
const normal = JSON.parse(bezier.normal(options.t));
const curvature = bezier.curvature(options.t);
const radius = 1 / curvature;
const curvatureCenter = { x: point.x + normal.x * radius, y: point.y + normal.y * radius };
drawCircle(context, curvatureCenter, Math.abs(radius), COLORS.NON_INTERACTIVE.STROKE_1);
drawLine(context, point, curvatureCenter, COLORS.NON_INTERACTIVE.STROKE_1);
drawPoint(context, point, 3, COLORS.NON_INTERACTIVE.STROKE_1);
drawPoint(context, curvatureCenter, 3, COLORS.NON_INTERACTIVE.STROKE_1);
},
curveDegrees: new Set([BezierCurveType.Quadratic, BezierCurveType.Cubic]),
template: markRaw(SliderExample),
templateOptions: { sliders: [tSliderOptions] },
},
{
name: "Split",
callback: (canvas: HTMLCanvasElement, bezier: WasmBezierInstance, options: Record<string, number>): void => {