SVG export (#598)

* first draft of export to SVG. WIP

* enabled text rendeing - which is not quite right atm

* placeholder svg icon

* size the canvas based on the bounding box of elements

* Do not add opacity attributes if default

* render background rect

* Ensure arrows are in the same SVG group

* parse font-size from font

* export web fonts

* use fixed locations for fonts

* Rename export functions

* renamed export file

* oops broke the icon.
This commit is contained in:
Preet 2020-01-28 12:25:13 -08:00 committed by GitHub
parent 321e4022b0
commit 97b11b0f53
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 447 additions and 202 deletions

View file

@ -1,4 +1,5 @@
import { RoughCanvas } from "roughjs/bin/canvas";
import { RoughSVG } from "roughjs/bin/svg";
import { ExcalidrawElement } from "../element/types";
import { getElementAbsoluteCoords, handlerRectangles } from "../element";
@ -11,7 +12,7 @@ import {
SCROLLBAR_WIDTH,
} from "../scene/scrollbars";
import { renderElement } from "./renderElement";
import { renderElement, renderElementToSvg } from "./renderElement";
export function renderScene(
elements: readonly ExcalidrawElement[],
@ -154,3 +155,31 @@ function isVisibleElement(
y2 += scrollY;
return x2 >= 0 && x1 <= canvasWidth && y2 >= 0 && y1 <= canvasHeight;
}
// This should be only called for exporting purposes
export function renderSceneToSvg(
elements: readonly ExcalidrawElement[],
rsvg: RoughSVG,
svgRoot: SVGElement,
{
offsetX = 0,
offsetY = 0,
}: {
offsetX?: number;
offsetY?: number;
} = {},
) {
if (!svgRoot) {
return;
}
// render elements
elements.forEach(element => {
renderElementToSvg(
element,
rsvg,
svgRoot,
element.x + offsetX,
element.y + offsetY,
);
});
}