From 4ea73d5d5b1bf224a4e098d3d593f09b8ab23763 Mon Sep 17 00:00:00 2001 From: Jai Kumar Dewani Date: Sun, 5 Dec 2021 21:26:19 +0530 Subject: [PATCH] feat: Add support for rounded corners in diamond (#4369) --- src/renderer/renderElement.ts | 48 ++++++++++++++++++++++++++++------- src/scene/comparisons.ts | 5 +++- 2 files changed, 43 insertions(+), 10 deletions(-) diff --git a/src/renderer/renderElement.ts b/src/renderer/renderElement.ts index 9f2eeac6..ad186f09 100644 --- a/src/renderer/renderElement.ts +++ b/src/renderer/renderElement.ts @@ -400,15 +400,45 @@ const generateElementShape = ( case "diamond": { const [topX, topY, rightX, rightY, bottomX, bottomY, leftX, leftY] = getDiamondPoints(element); - shape = generator.polygon( - [ - [topX, topY], - [rightX, rightY], - [bottomX, bottomY], - [leftX, leftY], - ], - generateRoughOptions(element), - ); + if (element.strokeSharpness === "round") { + shape = generator.path( + `M ${topX + (rightX - topX) * 0.25} ${ + topY + (rightY - topY) * 0.25 + } L ${rightX - (rightX - topX) * 0.25} ${ + rightY - (rightY - topY) * 0.25 + } + C ${rightX} ${rightY}, ${rightX} ${rightY}, ${ + rightX - (rightX - bottomX) * 0.25 + } ${rightY + (bottomY - rightY) * 0.25} + L ${bottomX + (rightX - bottomX) * 0.25} ${ + bottomY - (bottomY - rightY) * 0.25 + } + C ${bottomX} ${bottomY}, ${bottomX} ${bottomY}, ${ + bottomX - (bottomX - leftX) * 0.25 + } ${bottomY - (bottomY - leftY) * 0.25} + L ${leftX + (bottomX - leftX) * 0.25} ${ + leftY + (bottomY - leftY) * 0.25 + } + C ${leftX} ${leftY}, ${leftX} ${leftY}, ${ + leftX + (topX - leftX) * 0.25 + } ${leftY - (leftY - topY) * 0.25} + L ${topX - (topX - leftX) * 0.25} ${topY + (leftY - topY) * 0.25} + C ${topX} ${topY}, ${topX} ${topY}, ${ + topX + (rightX - topX) * 0.25 + } ${topY + (rightY - topY) * 0.25}`, + generateRoughOptions(element, true), + ); + } else { + shape = generator.polygon( + [ + [topX, topY], + [rightX, rightY], + [bottomX, bottomY], + [leftX, leftY], + ], + generateRoughOptions(element), + ); + } break; } case "ellipse": diff --git a/src/scene/comparisons.ts b/src/scene/comparisons.ts index 856ac75d..618f2966 100644 --- a/src/scene/comparisons.ts +++ b/src/scene/comparisons.ts @@ -29,7 +29,10 @@ export const hasStrokeStyle = (type: string) => type === "line"; export const canChangeSharpness = (type: string) => - type === "rectangle" || type === "arrow" || type === "line"; + type === "rectangle" || + type === "arrow" || + type === "line" || + type === "diamond"; export const hasText = (type: string) => type === "text";