smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

use element API to create regular text, diamond, ellipse and rectangle

Browse source
This commit is contained in:
Aakansha Doshi 2023-08-03 11:53:54 +05:30
parent 685ece4b3a
commit e49c94f22f
1 changed files with 58 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

115
src/data/transform.ts
View file

@ -489,64 +489,65 @@ export const convertToExcalidrawElements = (
elementStore.add(startBoundElement);
elementStore.add(endBoundElement);
}
} else {
let excalidrawElement;
if (elementWithId.type === "text") {
const fontFamily = elementWithId?.fontFamily || DEFAULT_FONT_FAMILY;
const fontSize = elementWithId?.fontSize || DEFAULT_FONT_SIZE;
const lineHeight =
elementWithId?.lineHeight || getDefaultLineHeight(fontFamily);
const text = elementWithId.text ?? "";
const normalizedText = normalizeText(text);
const metrics = measureText(
normalizedText,
getFontString({ fontFamily, fontSize }),
lineHeight,
);
excalidrawElement = {
width: metrics.width,
height: metrics.height,
fontFamily,
fontSize,
...elementWithId,
};
} else if (elementWithId.type === "text") {
const fontFamily = elementWithId?.fontFamily || DEFAULT_FONT_FAMILY;
const fontSize = elementWithId?.fontSize || DEFAULT_FONT_SIZE;
const lineHeight =
elementWithId?.lineHeight || getDefaultLineHeight(fontFamily);
const text = elementWithId.text ?? "";
const normalizedText = normalizeText(text);
const metrics = measureText(
normalizedText,
getFontString({ fontFamily, fontSize }),
lineHeight,
);
elementStore.add(excalidrawElement as ExcalidrawTextElement);
} else if (elementWithId.type === "arrow") {
const { linearElement, startBoundElement, endBoundElement } =
bindLinearElementToElement(elementWithId, elementStore);
elementStore.add(linearElement);
elementStore.add(startBoundElement);
elementStore.add(endBoundElement);
} else if (elementWithId.type === "line") {
const width = elementWithId.width || DEFAULT_LINEAR_ELEMENT_PROPS.width;
const height =
elementWithId.height || DEFAULT_LINEAR_ELEMENT_PROPS.height;
const lineElement = newLinearElement({
width,
height,
points: [
[0, 0],
[width, height],
],
...elementWithId,
});
elementStore.add(lineElement);
} else if (elementWithId.type === "image") {
const imageElement = newImageElement({
width: elementWithId?.width || DEFAULT_DIMENSION,
height: elementWithId?.height || DEFAULT_DIMENSION,
...elementWithId,
});
elementStore.add(imageElement);
} else {
excalidrawElement = {
...elementWithId,
width: elementWithId?.width || DEFAULT_DIMENSION,
height: elementWithId?.height || DEFAULT_DIMENSION,
} as ExcalidrawGenericElement;
elementStore.add(excalidrawElement);
}
const textElement = newTextElement({
width: metrics.width,
height: metrics.height,
fontFamily,
fontSize,
...elementWithId,
});
elementStore.add(textElement);
} else if (elementWithId.type === "arrow") {
const { linearElement, startBoundElement, endBoundElement } =
bindLinearElementToElement(elementWithId, elementStore);
elementStore.add(linearElement);
elementStore.add(startBoundElement);
elementStore.add(endBoundElement);
} else if (elementWithId.type === "line") {
const width = elementWithId.width || DEFAULT_LINEAR_ELEMENT_PROPS.width;
const height =
elementWithId.height || DEFAULT_LINEAR_ELEMENT_PROPS.height;
const lineElement = newLinearElement({
width,
height,
points: [
[0, 0],
[width, height],
],
...elementWithId,
});
elementStore.add(lineElement);
} else if (elementWithId.type === "image") {
const imageElement = newImageElement({
width: elementWithId?.width || DEFAULT_DIMENSION,
height: elementWithId?.height || DEFAULT_DIMENSION,
...elementWithId,
});
elementStore.add(imageElement);
} else if (
elementWithId.type === "rectangle" ||
elementWithId.type === "ellipse" ||
elementWithId.type === "diamond"
) {
const element = newElement({
...elementWithId,
width: elementWithId?.width || DEFAULT_DIMENSION,
height: elementWithId?.height || DEFAULT_DIMENSION,
});
elementStore.add(element);
}
});
return elementStore.get();