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

Add free draw mode (#1570)

Browse source
This commit is contained in:
Kostas Bariotis 2020-05-12 20:10:11 +01:00 • committed by GitHub
parent 36e0c439fb
commit 9ec43d2626
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
21 changed files with 344 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/renderer/renderElement.ts
View file

@ -3,7 +3,7 @@ import {
ExcalidrawTextElement,
NonDeletedExcalidrawElement,
} from "../element/types";
import { isTextElement } from "../element/typeChecks";
import { isTextElement, isLinearElement } from "../element/typeChecks";
import {
getDiamondPoints,
getArrowPoints,
@ -35,12 +35,10 @@ function generateElementCanvas(
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d")!;
const isLinear = /\b(arrow|line)\b/.test(element.type);
let canvasOffsetX = 0;
let canvasOffsetY = 0;
if (isLinear) {
if (isLinearElement(element)) {
const [x1, y1, x2, y2] = getElementAbsoluteCoords(element);
canvas.width =
distance(x1, x2) * window.devicePixelRatio * zoom + CANVAS_PADDING * 2;
@ -90,6 +88,7 @@ function drawElementOnCanvas(
break;
}
case "arrow":
case "draw":
case "line": {
(getShapeForElement(element) as Drawable[]).forEach((shape) =>
rc.draw(shape),
@ -226,6 +225,7 @@ function generateElement(
);
break;
case "line":
case "draw":
case "arrow": {
const options: Options = {
stroke: element.strokeColor,
@ -240,7 +240,7 @@ function generateElement(
// If shape is a line and is a closed shape,
// fill the shape if a color is set.
if (element.type === "line") {
if (element.type === "line" || element.type === "draw") {
if (isPathALoop(element.points)) {
options.fillStyle = element.fillStyle;
options.fill =
@ -343,6 +343,7 @@ export function renderElement(
case "diamond":
case "ellipse":
case "line":
case "draw":
case "arrow":
case "text": {
const elementWithCanvas = generateElement(element, generator, sceneState);
@ -410,6 +411,7 @@ export function renderElementToSvg(
break;
}
case "line":
case "draw":
case "arrow": {
generateElement(element, generator);
const group = svgRoot.ownerDocument!.createElementNS(SVG_NS, "g");
@ -427,7 +429,7 @@ export function renderElementToSvg(
}) rotate(${degree} ${cx} ${cy})`,
);
if (
element.type === "line" &&
(element.type === "line" || element.type === "draw") &&
isPathALoop(element.points) &&
element.backgroundColor !== "transparent"
) {