mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
allow multiple arrows to bind to single element
This commit is contained in:
parent
985318e960
commit
596edaea62
1 changed files with 20 additions and 25 deletions
|
@ -41,9 +41,11 @@ const bindTextToContainer = (
|
||||||
) => {
|
) => {
|
||||||
let container;
|
let container;
|
||||||
if (containerProps.type === "arrow") {
|
if (containerProps.type === "arrow") {
|
||||||
|
const width = containerProps.width || 300;
|
||||||
|
const height = containerProps.height || 24;
|
||||||
container = newLinearElement({
|
container = newLinearElement({
|
||||||
width: containerProps.width || 300,
|
width,
|
||||||
height: containerProps.height || 24,
|
height,
|
||||||
//@ts-ignore
|
//@ts-ignore
|
||||||
type: containerProps.type,
|
type: containerProps.type,
|
||||||
//@ts-ignore,
|
//@ts-ignore,
|
||||||
|
@ -51,7 +53,7 @@ const bindTextToContainer = (
|
||||||
//@ts-ignore
|
//@ts-ignore
|
||||||
points: [
|
points: [
|
||||||
[0, 0],
|
[0, 0],
|
||||||
[300, 0],
|
[width, height],
|
||||||
],
|
],
|
||||||
...containerProps,
|
...containerProps,
|
||||||
});
|
});
|
||||||
|
@ -106,7 +108,6 @@ const bindLinearElementToElement = (
|
||||||
id?: ExcalidrawGenericElement["id"];
|
id?: ExcalidrawGenericElement["id"];
|
||||||
} & MarkOptional<ElementConstructorOpts, "x" | "y">;
|
} & MarkOptional<ElementConstructorOpts, "x" | "y">;
|
||||||
} & Partial<ExcalidrawLinearElement>,
|
} & Partial<ExcalidrawLinearElement>,
|
||||||
elements: ImportedDataState["elements"],
|
|
||||||
): {
|
): {
|
||||||
linearElement: ExcalidrawLinearElement;
|
linearElement: ExcalidrawLinearElement;
|
||||||
startBoundElement?: ExcalidrawElement;
|
startBoundElement?: ExcalidrawElement;
|
||||||
|
@ -119,23 +120,20 @@ const bindLinearElementToElement = (
|
||||||
endArrowhead = linearElement.type === "arrow" ? "arrow" : null,
|
endArrowhead = linearElement.type === "arrow" ? "arrow" : null,
|
||||||
...rest
|
...rest
|
||||||
} = linearElement;
|
} = linearElement;
|
||||||
|
const width = linearElement.width || 300;
|
||||||
|
const height = linearElement.height || 24;
|
||||||
const excliadrawLinearElement = newLinearElement({
|
const excliadrawLinearElement = newLinearElement({
|
||||||
type,
|
type,
|
||||||
width: 200,
|
width,
|
||||||
height: 24,
|
height,
|
||||||
points: [
|
points: [
|
||||||
[0, 0],
|
[0, 0],
|
||||||
[200, 0],
|
[width, height],
|
||||||
],
|
],
|
||||||
endArrowhead,
|
endArrowhead,
|
||||||
...rest,
|
...rest,
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!elements || !elements.length) {
|
|
||||||
return { linearElement: excliadrawLinearElement };
|
|
||||||
}
|
|
||||||
|
|
||||||
let startBoundElement;
|
let startBoundElement;
|
||||||
let endBoundElement;
|
let endBoundElement;
|
||||||
|
|
||||||
|
@ -148,7 +146,7 @@ const bindLinearElementToElement = (
|
||||||
const width = start?.width ?? 100;
|
const width = start?.width ?? 100;
|
||||||
const height = start?.height ?? 100;
|
const height = start?.height ?? 100;
|
||||||
const existingElement = start.id
|
const existingElement = start.id
|
||||||
? elements.find((ele) => ele?.id === start.id)
|
? excalidrawElements.get().find((ele) => ele?.id === start.id)
|
||||||
: undefined;
|
: undefined;
|
||||||
startBoundElement = newElement({
|
startBoundElement = newElement({
|
||||||
x: start.x || excliadrawLinearElement.x - width,
|
x: start.x || excliadrawLinearElement.x - width,
|
||||||
|
@ -168,7 +166,7 @@ const bindLinearElementToElement = (
|
||||||
if (end) {
|
if (end) {
|
||||||
const height = end?.height ?? 100;
|
const height = end?.height ?? 100;
|
||||||
const existingElement = end.id
|
const existingElement = end.id
|
||||||
? elements.find((ele) => ele?.id === end.id)
|
? excalidrawElements.get().find((ele) => ele?.id === end.id)
|
||||||
: undefined;
|
: undefined;
|
||||||
endBoundElement = newElement({
|
endBoundElement = newElement({
|
||||||
x: end.x || excliadrawLinearElement.x + excliadrawLinearElement.width,
|
x: end.x || excliadrawLinearElement.x + excliadrawLinearElement.width,
|
||||||
|
@ -249,16 +247,13 @@ export const convertToExcalidrawElements = (
|
||||||
|
|
||||||
if (container.type === "arrow") {
|
if (container.type === "arrow") {
|
||||||
const { linearElement, startBoundElement, endBoundElement } =
|
const { linearElement, startBoundElement, endBoundElement } =
|
||||||
bindLinearElementToElement(
|
bindLinearElementToElement({
|
||||||
{
|
...container,
|
||||||
...container,
|
//@ts-ignore
|
||||||
//@ts-ignore
|
start: element?.start,
|
||||||
start: element?.start,
|
//@ts-ignore
|
||||||
//@ts-ignore
|
end: element?.end,
|
||||||
end: element?.end,
|
});
|
||||||
},
|
|
||||||
elements,
|
|
||||||
);
|
|
||||||
container = linearElement;
|
container = linearElement;
|
||||||
excalidrawElements.push(linearElement);
|
excalidrawElements.push(linearElement);
|
||||||
excalidrawElements.push(startBoundElement);
|
excalidrawElements.push(startBoundElement);
|
||||||
|
@ -274,7 +269,7 @@ export const convertToExcalidrawElements = (
|
||||||
} else if (element.type === "arrow" || element.type === "line") {
|
} else if (element.type === "arrow" || element.type === "line") {
|
||||||
const { linearElement, startBoundElement, endBoundElement } =
|
const { linearElement, startBoundElement, endBoundElement } =
|
||||||
//@ts-ignore
|
//@ts-ignore
|
||||||
bindLinearElementToElement(element, elements);
|
bindLinearElementToElement(element);
|
||||||
excalidrawElements.push(linearElement);
|
excalidrawElements.push(linearElement);
|
||||||
excalidrawElements.push(startBoundElement);
|
excalidrawElements.push(startBoundElement);
|
||||||
excalidrawElements.push(endBoundElement);
|
excalidrawElements.push(endBoundElement);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue