Releases: zsviczian/obsidian-excalidraw-plugin
Releases · zsviczian/obsidian-excalidraw-plugin
Excalidraw 2.8.0-beta-4
New
- Set local graph to show the links in the embeddable when it is activated / deactivated #2200
- Updated "Export Image" dialog
- 🚀 PDF Export option including tiling of images over multiple pages. Only available on desktop :(
- SVG to clipboard
- More granular setting for padding and scale
Fixed
- Fixed support for *.jfif and *.avif images #2212
- PDF++ selection is not correctly showing after embedded into a drawing (for some specific files) #2213
- iOS 18 can't upload image and library #2182
- Image block references are broken in hover previews #2218
- Mobile elements panel and context menu are not scrollable #2216
- "Local Font" menu disappears when opening a drawing in an Obsidian popout-window #2205
Updates from Excalidraw.com
- Pressing delete on a frame will only delete the children #9011
- New crowfoot arrowheads and a new arrowhead picker #8942
- Fixed some of the arrow binding issues #9010, #2209
- New context menu action: "Wrap selection in frame" #9005
- Elbow arrow segment fixing and positioning #8952
New in ExcalidrawAutomate
- New hook:
onImageFileNameHook. When set, this callback is triggered when a image is being saved in Excalidraw. - PDF export functions, paving the way for slideshow to export slides to PDF
/**
* Returns the dimensions of a standard page size in points (pt).
*
* @param {PageSize} pageSize - The standard page size. Possible values are "A0", "A1", "A2", "A3", "A4", "A5", "Letter", "Legal", "Tabloid".
* @param {PageOrientation} orientation - The orientation of the page. Possible values are "portrait" and "landscape".
* @returns {PageDimensions} - An object containing the width and height of the page in points (pt).
*
* @typedef {Object} PageDimensions
* @property {number} width - The width of the page in points (pt).
* @property {number} height - The height of the page in points (pt).
*
* @example
* const dimensions = getPageDimensions("A4", "portrait");
* console.log(dimensions); // { width: 595.28, height: 841.89 }
*/
getPagePDFDimensions(pageSize: PageSize, orientation: PageOrientation): PageDimensions;
/**
* Creates a PDF from the provided SVG elements with specified scaling and page properties.
*
* @param {Object} params - The parameters for creating the PDF.
* @param {SVGSVGElement[]} params.SVG - An array of SVG elements to be included in the PDF.
* @param {PDFExportScale} [params.scale={ fitToPage: true, zoom: 1 }] - The scaling options for the SVG elements.
* @param {PDFPageProperties} [params.pageProps] - The properties for the PDF pages.
* @returns {Promise<ArrayBuffer>} - A promise that resolves to an ArrayBuffer containing the PDF data.
*
* @example
* const pdfData = await createToPDF({
* SVG: [svgElement1, svgElement2],
* scale: { fitToPage: true },
* pageProps: {
* dimensions: { width: 595.28, height: 841.89 },
* backgroundColor: "#ffffff",
* margin: { left: 20, right: 20, top: 20, bottom: 20 },
* alignment: "center",
* exportDPI: 300,
* }
* });
*/
createPDF({ SVG, scale, pageProps, }: {
SVG: SVGSVGElement[];
scale?: PDFExportScale;
pageProps?: PDFPageProperties;
}): Promise<ArrayBuffer>;
/**
* If set, this callback is triggered when a image is being saved in Excalidraw.
* You can use this callback to customize the naming and path of pasted images to avoid
* default names like "Pasted image 123147170.png" being saved in the attachments folder,
* and instead use more meaningful names based on the Excalidraw file or other criteria,
* plus save the image in a different folder.
*
* If the function returns null or undefined, the normal Excalidraw operation will continue
* with the excalidraw generated name and default path.
* If a filepath is returned, that will be used. Include the full Vault filepath and filename
* with the file extension.
* The currentImageName is the name of the image generated by excalidraw or provided during paste.
*
* @param data - An object containing the following properties:
* @property {string} [currentImageName] - Default name for the image.
* @property {string} drawingFilePath - The file path of the Excalidraw file where the image is being used.
*
* @returns {string} - The new filepath for the image including full vault path and extension.
*
* Example usage:
* onImageFilePathHook: (data) => {
* const { currentImageName, drawingFilePath } = data;
* // Generate a new filepath based on the drawing file name and other criteria
* const ext = currentImageName.split('.').pop();
* return `${drawingFileName} - ${currentImageName || 'image'}.${ext}`;
* }
*/
onImageFilePathHook: (data: {
currentImageName: string; // Excalidraw generated name of the image, or the name received from the file system.
drawingFilePath: string; // The full filepath of the Excalidraw file where the image is being used.
}) => string = null;
```Excalidraw 2.8.0-beta-3
New
- Set local graph to show the links in the embeddable when it is activated / deactivated #2200
- Updated "Export Image" dialog
- 🚀 PDF Export option including tiling of images over multiple pages. Only available on desktop :(
- SVG to clipboard
- More granular setting for padding and scale
Fixed
- Fixed support for *.jfif and *.avif images #2212
- PDF++ selection is not correctly showing after embedded into a drawing (for some specific files) #2213
- iOS 18 can't upload image and library #2182
- Image block references are broken in hover previews #2218
- Mobile elements panel and context menu are not scrollable #2216
- "Local Font" menu disappears when opening a drawing in an Obsidian popout-window #2205
Updates from Excalidraw.com
- Pressing delete on a frame will only delete the children #9011
- New crowfoot arrowheads and a new arrowhead picker #8942
- Fixed some of the arrow binding issues #9010, #2209
- New context menu action: "Wrap selection in frame" #9005
- Elbow arrow segment fixing and positioning #8952
New in ExcalidrawAutomate
(paving the way for slideshow to export slides to PDF)
/**
* Returns the dimensions of a standard page size in points (pt).
*
* @param {PageSize} pageSize - The standard page size. Possible values are "A0", "A1", "A2", "A3", "A4", "A5", "Letter", "Legal", "Tabloid".
* @param {PageOrientation} orientation - The orientation of the page. Possible values are "portrait" and "landscape".
* @returns {PageDimensions} - An object containing the width and height of the page in points (pt).
*
* @typedef {Object} PageDimensions
* @property {number} width - The width of the page in points (pt).
* @property {number} height - The height of the page in points (pt).
*
* @example
* const dimensions = getPageDimensions("A4", "portrait");
* console.log(dimensions); // { width: 595.28, height: 841.89 }
*/
getPagePDFDimensions(pageSize: PageSize, orientation: PageOrientation): PageDimensions;
/**
* Creates a PDF from the provided SVG elements with specified scaling and page properties.
*
* @param {Object} params - The parameters for creating the PDF.
* @param {SVGSVGElement[]} params.SVG - An array of SVG elements to be included in the PDF.
* @param {PDFExportScale} [params.scale={ fitToPage: true, zoom: 1 }] - The scaling options for the SVG elements.
* @param {PDFPageProperties} [params.pageProps] - The properties for the PDF pages.
* @returns {Promise<ArrayBuffer>} - A promise that resolves to an ArrayBuffer containing the PDF data.
*
* @example
* const pdfData = await createToPDF({
* SVG: [svgElement1, svgElement2],
* scale: { fitToPage: true },
* pageProps: {
* dimensions: { width: 595.28, height: 841.89 },
* backgroundColor: "#ffffff",
* margin: { left: 20, right: 20, top: 20, bottom: 20 },
* alignment: "center",
* exportDPI: 300,
* }
* });
*/
createPDF({ SVG, scale, pageProps, }: {
SVG: SVGSVGElement[];
scale?: PDFExportScale;
pageProps?: PDFPageProperties;
}): Promise<ArrayBuffer>;
```Excalidraw 2.8.0-beta-2
Fixed PDF export issues
Excalidraw 2.8.0-beta-1
New
- Set local graph to show the links in the embeddable when it is activated / deactivated #2200
- Updated "Export Image" dialog
- PDF Export option including tiling of images over multiple pages.
- SVG to clipboard
- More granular setting for padding and scale
Fixed
- Fixed support for *.jfif and *.avif images #2212
- PDF++ selection is not correctly showing after embedded into a drawing (for some specific files) #2213
- iOS 18 can't upload image and library #2182
Updates from Excalidraw.com
- Pressing delete on a frame will only delete the children #9011
- New crowfoot arrowheads and a new arrowhead picker #8942
- Fixed some of the arrow binding issues #9010
- New context menu action: "Wrap selection in frame" #9005
- Elbow arrow segment fixing and positioning #8952
New in ExcalidrawAutomate
(paving the way for slideshow to export slides to PDF)
/**
* Returns the dimensions of a standard page size in points (pt).
*
* @param {PageSize} pageSize - The standard page size. Possible values are "A0", "A1", "A2", "A3", "A4", "A5", "Letter", "Legal", "Tabloid".
* @param {PageOrientation} orientation - The orientation of the page. Possible values are "portrait" and "landscape".
* @returns {PageDimensions} - An object containing the width and height of the page in points (pt).
*
* @typedef {Object} PageDimensions
* @property {number} width - The width of the page in points (pt).
* @property {number} height - The height of the page in points (pt).
*
* @example
* const dimensions = getPageDimensions("A4", "portrait");
* console.log(dimensions); // { width: 595.28, height: 841.89 }
*/
getPagePDFDimensions(pageSize: PageSize, orientation: PageOrientation): PageDimensions;
/**
* Creates a PDF from the provided SVG elements with specified scaling and page properties.
*
* @param {Object} params - The parameters for creating the PDF.
* @param {SVGSVGElement[]} params.SVG - An array of SVG elements to be included in the PDF.
* @param {PDFExportScale} [params.scale={ fitToPage: true, zoom: 1 }] - The scaling options for the SVG elements.
* @param {PDFPageProperties} [params.pageProps] - The properties for the PDF pages.
* @returns {Promise<ArrayBuffer>} - A promise that resolves to an ArrayBuffer containing the PDF data.
*
* @example
* const pdfData = await createToPDF({
* SVG: [svgElement1, svgElement2],
* scale: { fitToPage: true },
* pageProps: {
* dimensions: { width: 595.28, height: 841.89 },
* backgroundColor: "#ffffff",
* margin: { left: 20, right: 20, top: 20, bottom: 20 },
* alignment: "center"
* }
* });
*/
createPDF({ SVG, scale, pageProps, }: {
SVG: SVGSVGElement[];
scale?: PDFExportScale;
pageProps?: PDFPageProperties;
}): Promise<ArrayBuffer>;
```2.7.6-beta-1
Excalidraw 2.7.5-beta-1
Fixed
- PDF export scenario described in #2184
- Elbow arrows do not work within frames #2187
- Embedding images into Excalidraw with areaRef links did not work as expected due to conflicting SVG viewbox and width and height values
- Can't exit full-screen mode in popout windows using the Command Palette toggle action #2188
- If the image mask extended beyond the image in "Mask and Crop" image mode, the mask got misaligned from the image.
- PDF image embedding fixes that impacted some PDF files (not all):
- When cropping the PDF page in the scene (by double-clicking the image to crop), the size and position of the PDF cutout drifted.
- Using PDF++ there was a small offset in the position of the cutout in PDF++ and the image in Excalidraw.
New in ExcalidrawAutomate
/**
* Add, modify, or delete keys in element.customData and preserve existing keys.
* Creates customData={} if it does not exist.
* Takes the element id for an element in ea.elementsDict and the newData to add or modify.
* To delete keys set key value in newData to undefined. So {keyToBeDeleted:undefined} will be deleted.
* @param id
* @param newData
* @returns undefined if element does not exist in elementsDict, returns the modified element otherwise.
*/
public addAppendUpdateCustomData(id:string, newData: Partial<Record<string, unknown>>);
Minor code refactoring
- Replaced some instances of
anywith proper type - Removed few instances of
//@ts-ignore - Updated javadoc-style documentation of ExcalidrawAutomate
- Updated ExcalidrawAutomate lib
Excalidraw 2.7.5
Fixed
- PDF export scenario described in #2184
- Elbow arrows do not work within frames #2187
- Embedding images into Excalidraw with areaRef links did not work as expected due to conflicting SVG viewbox and width and height values
- Can't exit full-screen mode in popout windows using the Command Palette toggle action #2188
- If the image mask extended beyond the image in "Mask and Crop" image mode, the mask got misaligned from the image.
- PDF image embedding fixes that impacted some PDF files (not all):
- When cropping the PDF page in the scene (by double-clicking the image to crop), the size and position of the PDF cutout drifted.
- Using PDF++ there was a small offset in the position of the cutout in PDF++ and the image in Excalidraw.
- Images cropped from PDF++ before Excalidraw's new cropping feature was introduced did not load.
- Updated a number of scripts including Split Ellipse, Select Similar Elements, and Concatenate Lines
New in ExcalidrawAutomate
/**
* Add, modify, or delete keys in element.customData and preserve existing keys.
* Creates customData={} if it does not exist.
* Takes the element id for an element in ea.elementsDict and the newData to add or modify.
* To delete keys set key value in newData to undefined. So {keyToBeDeleted:undefined} will be deleted.
* @param id
* @param newData
* @returns undefined if element does not exist in elementsDict, returns the modified element otherwise.
*/
public addAppendUpdateCustomData(id:string, newData: Partial<Record<string, unknown>>);
Minor code refactoring
- Replaced some instances of
anywith proper type - Removed few instances of
//@ts-ignore - Updated javadoc-style documentation of ExcalidrawAutomate
- Updated ExcalidrawAutomate lib
Excalidraw 2.7.4
Fixed
- Regression from 2.7.3 where image fileId got overwritten in some cases
- White flash when opening a dark drawing #2178
Excalidraw 2.7.3
New
- Shade Master Script: A new script that allows you to modify the color lightness, hue, saturation, and transparency of selected Excalidraw elements, SVG images, and nested Excalidraw drawings. When a single image is selected, you can map colors individually. The original image remains unchanged, and a mapping table is added under
## Embedded Filesfor SVG and nested drawings. This helps maintain links between drawings while allowing different color themes. - New Command Palette Command: "Duplicate selected image with a different image ID". Creates a copy of the selected image with a new image ID. This allows you to add multiple color mappings to the same image. In the scene, the image will be treated as if a different image, but loaded from the same file in the Vault.
QoL Improvements
- New setting under
Embedding Excalidraw into your notes and Exporting>Image Caching and rendering optimization. You can now set the number of concurrent workers that render your embedded images. Increasing the number will increase the speed but temporarily reduce the responsiveness of your system in case of large drawings. - Moved pen-related settings under
Excalidraw appearance and behaviorto their sub-heading calledPen. - Minor error fixing and performance optimizations when loading and updating embedded images.
- Color maps in
## Embedded Filesmay now include color keys "stroke" and "fill". If set, these will change the fill and stroke attributes of the SVG root element of the relevant file.
Fixed
- Toggling image size anchoring on and off by modifying the image link did not update the image in the view until the user forced saved it or closed and opened the drawing again. This was a side-effect of the less frequent view save introduced in 2.7.1
New in ExcalidrawAutomate
// Updates the color map of an SVG image element in the view. If a ColorMap is provided, it will be used directly.
// If an SVGColorInfo is provided, it will be converted to a ColorMap.
// The view will be marked as dirty and the image will be reset using the color map.
updateViewSVGImageColorMap(
elements: ExcalidrawImageElement | ExcalidrawImageElement[],
colors: ColorMap | SVGColorInfo | ColorMap[] | SVGColorInfo[]
): Promise<void>;
// Retrieves the color map for an image element.
// The color map contains information about the mapping of colors used in the image.
// If the element already has a color map, it will be returned.
getColorMapForImageElement(el: ExcalidrawElement): ColorMap;
// Retrieves the color map for an SVG image element.
// The color map contains information about the fill and stroke colors used in the SVG.
// If the element already has a color map, it will be merged with the colors extracted from the SVG.
getColorMapForImgElement(el: ExcalidrawElement): Promise<SVGColorInfo>;
// Extracts the fill (background) and stroke colors from an Excalidraw file and returns them as an SVGColorInfo.
getColosFromExcalidrawFile(file:TFile, img: ExcalidrawImageElement): Promise<SVGColorInfo>;
// Extracts the fill and stroke colors from an SVG string and returns them as an SVGColorInfo.
getColorsFromSVGString(svgString: string): SVGColorInfo;
// upgraded the addImage function.
// 1. It now accepts an object as the input parameter, making your scripts more readable
// 2. AddImageOptions now includes colorMap as an optional parameter, this will only have an effect in case of SVGs and nested Excalidraws
// 3. The API function is backwards compatible, but I recommend new implementations to use the object based input
addImage(opts: AddImageOptions}): Promise<string>;
interface AddImageOptions {
topX: number;
topY: number;
imageFile: TFile | string;
scale?: boolean;
anchor?: boolean;
colorMap?: ColorMap;
}
type SVGColorInfo = Map<string, {
mappedTo: string;
fill: boolean;
stroke: boolean;
}>;
interface ColorMap {
[color: string]: string;
};Excalidraw 2.7.2
Fixed
- The plugin did not load on iOS 16 and older. #2170
- Added empty line between
# Excalidraw Dataand## Text Elements. This will now follow correct markdown linting. #2168 - Adding an embeddable to view did not honor the element background and element stroke colors, even if it was configured in plugin settings. #2172
- Deconstruct selected elements script did not copy URLs and URIs for images embedded from outside Obsidian. Please update your script from the script library.
- When rearranging tabs in Obsidian, e.g. having two tabs side by side, and moving one of them to another location, if the tab was an Excalidraw tab, it appeared as non-responsive after the move, until the tab was resized.
Source Code Refactoring
- Updated filenames, file locations, and file name letter-casing across the project
- Extracted onDrop, onDragover, etc. handlers to DropManger in ExcalidrawView