sambruk/excalidraw
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Better rendering of curved rectangles (#3562)

Browse Source
This commit is contained in:
Preet 2021-05-10 03:41:17 -07:00 committed by GitHub
parent 11b8cc2caa
commit f4fefbcee8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -44,7 +44,7 @@
"react": "17.0.2", "react": "17.0.2",
"react-dom": "17.0.2", "react-dom": "17.0.2",
"react-scripts": "4.0.3", "react-scripts": "4.0.3",
"roughjs": "4.3.1", "roughjs": "4.4.0",
"sass": "1.32.10", "sass": "1.32.10",
"socket.io-client": "2.3.1", "socket.io-client": "2.3.1",
"typescript": "4.2.4" "typescript": "4.2.4"

8
src/renderer/renderElement.ts
View File

@ -228,7 +228,10 @@ export const getShapeForElement = (element: ExcalidrawElement) =>
export const invalidateShapeForElement = (element: ExcalidrawElement) => export const invalidateShapeForElement = (element: ExcalidrawElement) =>
shapeCache.delete(element); shapeCache.delete(element);
export const generateRoughOptions = (element: ExcalidrawElement): Options => { export const generateRoughOptions = (
element: ExcalidrawElement,
continuousPath = false,
): Options => {
const options: Options = { const options: Options = {
seed: element.seed, seed: element.seed,
strokeLineDash: strokeLineDash:
@ -253,6 +256,7 @@ export const generateRoughOptions = (element: ExcalidrawElement): Options => {
hachureGap: element.strokeWidth * 4, hachureGap: element.strokeWidth * 4,
roughness: element.roughness, roughness: element.roughness,
stroke: element.strokeColor, stroke: element.strokeColor,
preserveVertices: continuousPath,
}; };
switch (element.type) { switch (element.type) {
@ -314,7 +318,7 @@ const generateElementShape = (
} Q ${w} ${h}, ${w - r} ${h} L ${r} ${h} Q 0 ${h}, 0 ${ } Q ${w} ${h}, ${w - r} ${h} L ${r} ${h} Q 0 ${h}, 0 ${
h - r h - r
} L 0 ${r} Q 0 0, ${r} 0`, } L 0 ${r} Q 0 0, ${r} 0`,
generateRoughOptions(element), generateRoughOptions(element, true),
); );
} else { } else {
shape = generator.rectangle( shape = generator.rectangle(

7
yarn.lock
View File

@ -10851,9 +10851,10 @@ rollup@^1.31.1:
"@types/node" "*" "@types/node" "*"
acorn "^7.1.0" acorn "^7.1.0"
roughjs@4.3.1: roughjs@4.4.0:
version "4.3.1" version "4.4.0"
resolved "https://registry.npmjs.org/roughjs/-/roughjs-4.3.1.tgz" resolved "https://registry.yarnpkg.com/roughjs/-/roughjs-4.4.0.tgz#56ee4b3c8a453af8debc03b81e636dcab9efcdb2"
integrity sha512-mDjSVK/RdRwdi4Dw9u5eoMiEsblEr6y2ZpOSyYa5IAAPbpUqplPezWbj4+J2gJlnxKKcRX+ccH26LFDyplhXXQ==
dependencies: dependencies:
path-data-parser "^0.1.0" path-data-parser "^0.1.0"
points-on-curve "^0.2.0" points-on-curve "^0.2.0"