diff --git a/packages/perfect-freehand/src/getStrokeOutlinePoints.ts b/packages/perfect-freehand/src/getStrokeOutlinePoints.ts index 0cf2706..3a1444e 100644 --- a/packages/perfect-freehand/src/getStrokeOutlinePoints.ts +++ b/packages/perfect-freehand/src/getStrokeOutlinePoints.ts @@ -127,6 +127,10 @@ export function getStrokeOutlinePoints( let tl = pl let tr = pr + // Keep track of whether the previous point is a sharp corner + // ... so that we don't detect the same corner twice + let isPrevPointSharpCorner = false + // let short = true /* @@ -197,18 +201,6 @@ export function getStrokeOutlinePoints( /* Add points to left and right */ - // Handle the last point - if (i === points.length - 1) { - const offset = mul(per(vector), radius) - leftPts.push(sub(point, offset)) - rightPts.push(add(point, offset)) - continue - } - - const nextVector = points[i + 1].vector - - const nextDpr = dpr(vector, nextVector) - /* Handle sharp corners @@ -217,7 +209,14 @@ export function getStrokeOutlinePoints( draw a cap at the current point. */ - if (nextDpr < 0) { + const nextVector = (i < points.length - 1? points[i + 1] : points[i]).vector + const nextDpr = (i < points.length - 1? dpr(vector, nextVector) : 1.0) + const prevDpr = dpr(vector, prevVector) + + const isPointSharpCorner = prevDpr < 0 && !isPrevPointSharpCorner + const isNextPointSharpCorner = nextDpr !== null && nextDpr < 0 + + if (isPointSharpCorner || isNextPointSharpCorner) { // It's a sharp corner. Draw a rounded cap and move on to the next point // Considering saving these and drawing them later? So that we can avoid // crossing future points. @@ -235,6 +234,19 @@ export function getStrokeOutlinePoints( pl = tl pr = tr + if (isNextPointSharpCorner) { + isPrevPointSharpCorner = true + } + continue + } + + isPrevPointSharpCorner = false + + // Handle the last point + if (i === points.length - 1) { + const offset = mul(per(vector), radius) + leftPts.push(sub(point, offset)) + rightPts.push(add(point, offset)) continue } diff --git a/packages/perfect-freehand/src/test/__snapshots__/getStroke.spec.ts.snap b/packages/perfect-freehand/src/test/__snapshots__/getStroke.spec.ts.snap index b3b989f..f8017c2 100644 --- a/packages/perfect-freehand/src/test/__snapshots__/getStroke.spec.ts.snap +++ b/packages/perfect-freehand/src/test/__snapshots__/getStroke.spec.ts.snap @@ -1976,8 +1976,60 @@ Array [ 266.2468669394994, ], Array [ - 957.6602662835733, - 259.49321610477915, + 942.0612244920976, + 259.33589413407526, + ], + Array [ + 942.3265750466993, + 257.4741906980951, + ], + Array [ + 943.0297632070849, + 255.73009293378777, + ], + Array [ + 944.1299196443334, + 254.20496788516107, + ], + Array [ + 945.5631032146214, + 252.9874558916988, + ], + Array [ + 947.246017221506, + 252.14831880766553, + ], + Array [ + 949.0808506238355, + 251.73632731981203, + ], + Array [ + 950.9609628180574, + 251.77542639276962, + ], + Array [ + 952.7770815951068, + 252.26334358658096, + ], + Array [ + 954.4236540463315, + 253.17172113101702, + ], + Array [ + 955.8049813035026, + 254.4477640805153, + ], + Array [ + 956.8407805615318, + 256.01730875889626, + ], + Array [ + 957.4708511188758, + 257.78913315570776, + ], + Array [ + 957.6585732451377, + 259.66025875375817, ], Array [ 957.2533438954803, @@ -2096,8 +2148,60 @@ Array [ 259.4998168076582, ], Array [ - 942.0595476718931, - 259.502156915616, + 942.0612083518535, + 259.33667400313146, + ], + Array [ + 942.3263727347852, + 257.47494404140434, + ], + Array [ + 943.0293864818785, + 255.73077596700165, + ], + Array [ + 944.1293904011217, + 254.20554091035703, + ], + Array [ + 945.5624522130447, + 252.98788560462555, + ], + Array [ + 947.2452822978064, + 252.14858023338758, + ], + Array [ + 949.0800744918131, + 251.73640526425407, + ], + Array [ + 950.9601905865417, + 251.77531632579706, + ], + Array [ + 952.7763581462298, + 252.2630519052914, + ], + Array [ + 954.4230214269759, + 253.17126478794077, + ], + Array [ + 955.8044762815351, + 254.44716959833332, + ], + Array [ + 956.8404324888529, + 256.01661068894094, + ], + Array [ + 957.4706802254859, + 257.7883720698377, + ], + Array [ + 957.6585894633688, + 259.6594788863199, ], Array [ 957.4176762060673,