CanvasViewCanvas
Unofficial
Main canvas controller that manages rendering, selection, drag, zoom, pan, nodes, and edges for the canvas view.
Import:
import type { CanvasViewCanvas } from '@obsidian-typings/obsidian-catalyst-latest';Signature:
export interface CanvasViewCanvasProperties
| Property | Type | Description | |
|---|---|---|---|
| app | App | Reference to the Obsidian app instance. | |
| backgroundPatternEl | SVGPatternElement | SVG pattern element used for rendering the canvas background grid. | |
| canvasControlsEl | HTMLDivElement | Container element for canvas control buttons (zoom, undo/redo, etc.). | |
| canvasEl | HTMLDivElement | Main canvas container element. | |
| canvasRect | CanvasRectEx | Extended rectangle representing the canvas bounds. | |
| cardMenuEl | HTMLDivElement | Container element for the card creation menu. | |
| config | CanvasViewConfig | Configuration settings for the canvas view. | |
| data | CanvasViewData | Serialized canvas data containing nodes and edges. | |
| dirty | Set<unknown> | Set of items that have been modified and need saving. | |
| edgeContainerEl | SVGElement | SVG container element for edge lines. | |
| edgeEndContainerEl | SVGElement | SVG container element for edge endpoint markers. | |
| edgeFrom | MapOfSets<CanvasViewCanvasEdge, CanvasViewCanvasNode> | Mapping of edges to their source nodes. | |
| edgeIndex | EdgeIndex | Spatial index (R-tree) for efficient edge hit-testing. | |
| edges | Map<string, CanvasViewCanvasEdge> | Map of all edges on the canvas, keyed by edge ID. | |
| edgeTo | MapOfSets<CanvasViewCanvasEdge, CanvasViewCanvasNode> | Mapping of edges to their target nodes. | |
| finishViewportAnimation | boolean | Whether to finish the current viewport animation on the next frame. | |
| frame | number | Current animation frame request ID. | |
| frameWin | null | Animation frame window reference, null when not animating. | |
| gridSpacing | number | Spacing between grid lines in pixels. | |
| history | CanvasViewHistory | Undo/redo history manager for canvas state. | |
| isDragging | boolean | Whether the user is currently dragging on the canvas. | |
| isHoldingSpace | boolean | Whether the spacebar is currently held (for pan mode). | |
| keys | object | Map of currently pressed keyboard keys. | |
| lastEdgesInViewport | Set<CanvasViewCanvasEdge> | Set of edges that were visible in the viewport on the last render frame. | |
| lastNodesInViewport | Set<CanvasViewCanvasNode> | Set of nodes that were visible in the viewport on the last render frame. | |
| menu | CanvasMenu | Context menu and toolbar for the canvas. | |
| moved | Set<unknown> | Set of items that have been moved and need re-indexing. | |
| moverEl | HTMLDivElement | Element used for dragging/moving the canvas viewport. | |
| nodeIndex | EdgeIndex | Spatial index (R-tree) for efficient node hit-testing. | |
| nodeInteractionLayer | NodeInteractionLayer | Layer handling user interactions with nodes (resize, connect, etc.). | |
| nodes | Map<string, CanvasViewCanvasNode> | Map of all nodes on the canvas, keyed by node ID. | |
| options? | unknown | Optional configuration options for the canvas. | |
| pauseAnimation | number | Counter for pausing animation frames. | |
| pointer | Point | Current pointer position in canvas coordinates. | |
| pointerFrame | number | Animation frame request ID for pointer tracking. | |
| pointerFrameWin | null | Pointer frame window reference, null when not tracking. | |
| quickSettingsButton | HTMLDivElement | Button element for opening the quick settings menu. | |
| readonly | boolean | Whether the canvas is in read-only mode. | |
| redoBtnEl | HTMLDivElement | Button element for the redo action. | |
| requestPushHistory | Debouncer<[], unknown> | Debounced function to push the current state to history. | |
| requestUpdateFileOpen | Debouncer<[], unknown> | Debounced function to update the file open state. | |
| scale | number | Current zoom scale factor of the canvas viewport. | |
| screenshotting | boolean | Whether the canvas is currently being screenshotted. | |
| selection | Set<Selection> | Set of currently selected nodes and edges. | |
| selectionChanged | boolean | Whether the selection has changed since the last update. | |
| snapDistance? | unknown | Distance threshold for snapping behavior. | |
| staleSelection | null | Previously stale selection, null when selection is current. | |
| tx | number | Target X translation for viewport animation. | |
| ty | number | Target Y translation for viewport animation. | |
| tZoom | number | Target zoom level for viewport animation. | |
| undoBtnEl | HTMLDivElement | Button element for the undo action. | |
| view | CanvasView | Reference to the parent CanvasView. | |
| viewportChanged | boolean | Whether the viewport has changed since the last render frame. | |
| wasAnimating | boolean | Whether the canvas was animating on the previous frame. | |
| wrapperEl | HTMLDivElement | Outermost wrapper element for the canvas. | |
| x | number | Current X offset of the viewport in canvas coordinates. | |
| y | number | Current Y offset of the viewport in canvas coordinates. | |
| zIndexCounter | number | Counter for assigning z-index values to nodes. | |
| zoom | number | Current zoom level of the viewport. | |
| zoomBreakpoint? | unknown | Zoom level threshold for switching rendering detail levels. | |
| zoomCenter | null | Center point for zoom operations, null when not zooming. | |
| zoomToFitQueued | boolean | Whether a zoom-to-fit operation is queued for the next frame. |
Methods
| Method | Returns | Description | |
|---|---|---|---|
| addEdge(arg1) | unknown | Add an edge to the canvas. | |
| addNode(arg1) | unknown | Add a node to the canvas. | |
| applyHistory(arg1) | unknown | Apply a history state to restore the canvas to a previous state. | |
| cancelFrame() | unknown | Cancel the current pending animation frame. | |
| canSnap(arg1) | unknown | Check whether snapping is currently possible for the given context. | |
| clear() | unknown | Remove all nodes and edges from the canvas. | |
| clearSnapPoints() | unknown | Clear all active snap point guides. | |
| cloneData(arg1, arg2) | unknown | Clone canvas data, creating duplicates of the specified items at the given offset. | |
| createFileNode(arg1) | unknown | Create a new file-type node on the canvas. | |
| createFileNodes(arg1, arg2) | unknown | Create multiple file-type nodes on the canvas. | |
| createGroupNode(arg1) | unknown | Create a new group node on the canvas. | |
| createLinkNode(arg1) | unknown | Create a new link/URL node on the canvas. | |
| createPlaceholder() | unknown | Create a placeholder node for drag-and-drop operations. | |
| createTextNode(arg1) | unknown | Create a new text node on the canvas. | |
| deleteSelection() | unknown | Delete all currently selected nodes and edges. | |
| deselect(arg1) | unknown | Remove an item from the current selection. | |
| deselectAll() | unknown | Clear the entire selection. | |
| domFromPos(arg1) | unknown | Convert a canvas position to DOM pixel coordinates. | |
| domPosFromClient(arg1) | unknown | Convert client (screen) coordinates to DOM pixel coordinates. | |
| domPosFromEvt(arg1) | unknown | Convert a DOM event's position to DOM pixel coordinates. | |
| dragTempNode(arg1, arg2, arg3) | unknown | Handle dragging a temporary node during creation. | |
| endSnapPointRendering() | unknown | Stop rendering snap point guide lines. | |
| generateHDImage() | Promise<unknown> | Generate a high-definition image of the canvas. | |
| getContainingNodes(arg1) | unknown | Get all nodes that contain the specified bounding box or point. | |
| getData() | unknown | Get the serialized canvas data. | |
| getEdgesForNode(arg1) | unknown | Get all edges connected to the specified node. | |
| getIntersectingEdges(arg1) | unknown | Get all edges that intersect the specified bounding box. | |
| getIntersectingNodes(arg1) | unknown | Get all nodes that intersect the specified bounding box. | |
| getSelectionData(arg1) | unknown | Get serialized data for the current selection. | |
| getSnapping(arg1, arg2, arg3, arg4) | unknown | Calculate snap alignment guides for the given position and dimensions. | |
| getState() | unknown | Get the current viewport state (position, zoom). | |
| getViewportBBox() | unknown | Get the bounding box of the current viewport in canvas coordinates. | |
| getViewportNodes(arg1) | unknown | Get all nodes currently visible within the viewport. | |
| getZIndex() | unknown | Get the next available z-index value. | |
| handleCopy(arg1) | unknown | Handle a copy event for the current selection. | |
| handleCut(arg1) | unknown | Handle a cut event for the current selection. | |
| handleDragToSelect(arg1, arg2, arg3) | unknown | Handle drag-to-select (rubber band selection) interaction. | |
| handleDragWithPan(arg1, arg2) | unknown | Handle drag interaction with viewport panning. | |
| handleMoverPointerdown(arg1) | unknown | Handle pointer down event on the mover element. | |
| handlePaste(arg1) | unknown | Handle a paste event to add items to the canvas. | |
| handleSelectionDrag(arg1, arg2, arg3) | unknown | Handle dragging the current selection. | |
| hitTestNode(arg1, arg2) | unknown | Test whether a point hits a specific node. | |
| importData(arg1, arg2) | unknown | Import canvas data from an external source. | |
| interactionHitTest(arg1) | unknown | Perform a hit test for interactive elements at the given position. | |
| load() | unknown | Load and initialize the canvas from saved data. | |
| markDirty(arg1) | unknown | Mark an item as dirty (needing to be saved). | |
| markMoved(arg1) | unknown | Mark an item as having been moved (needing re-indexing). | |
| markViewportChanged() | unknown | Mark the viewport as changed, triggering a re-render. | |
| nudgeSelection(arg1, arg2) | unknown | Nudge the current selection by the specified offset. | |
| onContextMenu(arg1) | unknown | Handle context menu event on the canvas background. | |
| onDoubleClick(arg1) | unknown | Handle double-click event on the canvas. | |
| onGlobalKeydown(arg1) | unknown | Handle global keydown events. | |
| onGlobalKeyup(arg1) | unknown | Handle global keyup events. | |
| onKeydown(arg1) | unknown | Handle keydown events on the canvas. | |
| onPointerdown(arg1) | unknown | Handle pointer down events on the canvas. | |
| onPointermove(arg1) | unknown | Handle pointer move events on the canvas. | |
| onPriorityPointerdown(arg1) | unknown | Handle priority pointer down events (processed before other handlers). | |
| onResize() | unknown | Handle canvas container resize events. | |
| onSelectionContextMenu(arg1) | unknown | Handle context menu event on the current selection. | |
| onTouchdown(arg1) | unknown | Handle touch start events on the canvas. | |
| onWheel(arg1) | unknown | Handle mouse wheel events for zooming or panning. | |
| overrideHistory() | unknown | Override the current history entry with the latest state. | |
| panBy(arg1, arg2) | unknown | Pan the viewport by the specified delta. | |
| panIntoView(arg1, arg2) | unknown | Pan the viewport so the specified bounding box is visible. | |
| panTo(arg1, arg2) | unknown | Pan the viewport to the specified position. | |
| posCenter() | unknown | Get the center position of the current viewport. | |
| posFromClient(arg1) | unknown | Convert client (screen) coordinates to canvas coordinates. | |
| posFromDom(arg1) | unknown | Convert DOM pixel coordinates to canvas coordinates. | |
| posFromEvt(arg1) | unknown | Convert a DOM event's position to canvas coordinates. | |
| posInViewport(arg1) | unknown | Check whether a position is within the current viewport. | |
| pushHistory(arg1) | unknown | Push the current canvas state onto the undo history stack. | |
| redo() | unknown | Redo the last undone action. | |
| removeEdge(arg1) | unknown | Remove an edge from the canvas. | |
| removeNode(arg1) | unknown | Remove a node from the canvas. | |
| renderSnapPoints(arg1, arg2, arg3, arg4) | unknown | Render snap point guide lines for alignment. | |
| requestFrame(arg1) | unknown | Request an animation frame for rendering. | |
| requestSave(arg1) | unknown | Request saving the canvas data to disk. | |
| rerenderViewport() | unknown | Force a re-render of all items in the viewport. | |
| select(arg1) | unknown | Add an item to the current selection. | |
| selectAll(arg1) | unknown | Select all nodes and edges on the canvas. | |
| selectOnly(arg1) | unknown | Select only the specified item, deselecting everything else. | |
| setData(arg1) | unknown | Set the canvas data, replacing existing nodes and edges. | |
| setDragging(arg1) | unknown | Set the dragging state of the canvas. | |
| setReadonly(arg1) | unknown | Set the read-only state of the canvas. | |
| setState(arg1) | unknown | Set the viewport state (position, zoom). | |
| setViewport(arg1, arg2, arg3) | unknown | Set the viewport position and zoom level. | |
| showCreationMenu(arg1, arg2, arg3) | unknown | Show the node creation menu at the specified position. | |
| showQuickSettingsMenu(arg1) | unknown | Show the quick settings menu for canvas options. | |
| smartZoom(arg1) | unknown | Perform a smart zoom operation (toggle between zoom levels). | |
| takeScreenshot(arg1, arg2) | Promise<unknown> | Capture a screenshot of the canvas. | |
| toggleGridSnapping(arg1) | unknown | Toggle grid snapping on or off. | |
| toggleObjectSnapping(arg1) | unknown | Toggle object-to-object snapping on or off. | |
| toggleSelect(arg1) | unknown | Toggle the selection state of an item. | |
| undo() | unknown | Undo the last action. | |
| unload() | unknown | Unload and clean up the canvas resources. | |
| updateFileOpen(arg1) | unknown | Update the file open state for workspace tracking. | |
| updateHistoryUI() | unknown | Update the undo/redo button enabled states. | |
| updateSelection(arg1) | unknown | Update the visual state of the current selection. | |
| virtualize() | unknown | Virtualize off-screen nodes to improve performance. | |
| zoomBy(arg1, arg2) | unknown | Zoom the viewport by a delta amount at the specified center point. | |
| zoomToBbox(arg1) | unknown | Zoom the viewport to fit the specified bounding box. | |
| zoomToFit() | unknown | Zoom the viewport to fit all canvas content. | |
| zoomToSelection() | unknown | Zoom the viewport to fit the current selection. |
Links to this page: