marcel/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-09-19 15:31:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master' into danieljgeiger-mathjax

Browse Source
This commit is contained in:
Daniel J. Geiger
2023-01-08 17:06:23 -06:00
parent ace031e992 06b45e0cfc
commit f86d0f9102
5 changed files with 652 additions and 535 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/renderer/renderElement.ts
View File

@@ -720,22 +720,8 @@ const drawElementFromCanvas = (
const cx = ((x1 + x2) / 2 + renderConfig.scrollX) * window.devicePixelRatio;
const cy = ((y1 + y2) / 2 + renderConfig.scrollY) * window.devicePixelRatio;
const _isPendingImageElement = isPendingImageElement(element, renderConfig);
const scaleXFactor =
"scale" in elementWithCanvas.element && !_isPendingImageElement
? elementWithCanvas.element.scale[0]
: 1;
const scaleYFactor =
"scale" in elementWithCanvas.element && !_isPendingImageElement
? elementWithCanvas.element.scale[1]
: 1;
context.save();
context.scale(
(1 / window.devicePixelRatio) * scaleXFactor,
(1 / window.devicePixelRatio) * scaleYFactor,
);
context.scale(1 / window.devicePixelRatio, 1 / window.devicePixelRatio);
const boundTextElement = getBoundTextElement(element);
if (isArrowElement(element) && boundTextElement) {
@@ -800,7 +786,7 @@ const drawElementFromCanvas = (
zoom,
);
context.translate(cx * scaleXFactor, cy * scaleYFactor);
context.translate(cx, cy);
context.drawImage(
tempCanvas,
(-(x2 - x1) / 2) * window.devicePixelRatio - offsetX / zoom - padding,
@@ -809,15 +795,30 @@ const drawElementFromCanvas = (
tempCanvas.height / zoom,
);
} else {
context.translate(cx * scaleXFactor, cy * scaleYFactor);
// we translate context to element center so that rotation and scale
// originates from the element center
context.translate(cx, cy);
context.rotate(element.angle * scaleXFactor * scaleYFactor);
context.rotate(element.angle);
if (
"scale" in elementWithCanvas.element &&
!isPendingImageElement(element, renderConfig)
) {
context.scale(
elementWithCanvas.element.scale[0],
elementWithCanvas.element.scale[1],
);
}
// revert afterwards we don't have account for it during drawing
context.translate(-cx, -cy);
context.drawImage(
elementWithCanvas.canvas!,
(-(x2 - x1) / 2) * window.devicePixelRatio -
(x1 + renderConfig.scrollX) * window.devicePixelRatio -
(padding * elementWithCanvas.canvasZoom) / elementWithCanvas.canvasZoom,
(-(y2 - y1) / 2) * window.devicePixelRatio -
(y1 + renderConfig.scrollY) * window.devicePixelRatio -
(padding * elementWithCanvas.canvasZoom) / elementWithCanvas.canvasZoom,
elementWithCanvas.canvas!.width / elementWithCanvas.canvasZoom,
elementWithCanvas.canvas!.height / elementWithCanvas.canvasZoom,
@@ -912,9 +913,6 @@ export const renderElement = (
}
context.save();
context.translate(cx, cy);
if (element.type === "image") {
context.scale(element.scale[0], element.scale[1]);
}
if (shouldResetImageFilter(element, renderConfig)) {
context.filter = "none";
@@ -980,6 +978,12 @@ export const renderElement = (
);
} else {
context.rotate(element.angle);
if (element.type === "image") {
// note: scale must be applied *after* rotating
context.scale(element.scale[0], element.scale[1]);
}
context.translate(-shiftX, -shiftY);
drawElementOnCanvas(element, rc, context, renderConfig);
}