[FEATURE] Add canvas panel plugin

[adrianSepiol]

Description

Related to: perses/perses#3845

Introduces the canvas panel plugin — a free-form network diagram editor for building weathermap-style dashboards. Users can place nodes, connect them with edges, and overlay background shapes or images. Node and edge colors can be driven by query-bound thresholds, and edge thickness can scale with metric values.

Screenshots

Here's a walkthrough of the main interactions:

Example weather map created in canvas:

Adding a node:

Screen.Recording.2026-07-20.at.15.26.09.mov

After creating a node, you can specify its label and position, add a link, bind a query to it, and use the query value in the label or derive the color from thresholds.

Adding an edge:

Screen.Recording.2026-07-20.at.15.26.45.mov

Edges are created by dragging from one node to another. They can be bidirectional and, like nodes, can have a query bound to them.

Zoom, pan, and resize:

Screen.Recording.2026-07-20.at.15.32.35.mov

Adding backgrounds:

adding.background.mov

Multiple backgrounds can be added with an image or a solid color at varying opacity levels. If "Global" is selected, the background always fills the entire view regardless of pan/zoom; otherwise it is scoped to a specified area.

Checklist

• Pull request has a descriptive title and context useful to a reviewer.
• Pull request title follows the [<catalog_entry>] <commit message> naming convention using one of the
  following catalog_entry values: FEATURE, ENHANCEMENT, BUGFIX, BREAKINGCHANGE, DOC,IGNORE.
• All commits have DCO signoffs.

UI Changes

• Changes that impact the UI include screenshots and/or screencasts of the relevant changes.
• Code follows the UI guidelines.

[jgbernalp]

It appears to me that this is a nodes panel rather than a canvas. Unless we are thinking about adding other things different from nodes in the future.

[adrianSepiol]

Yes, We would like to develop it further with new things. I think adding background is one of the things that is already here and fits more into "canvas" than "nodes" plugin.

[jgbernalp]

First of all, awesome job @adrianSepiol!

Would be there an option to create a graph (nodes and connections) based on a query? for example network topology charts have queries that return a list of nodes and their connections. In that case could this panel create a graph from that information in addition to the manual placement of nodes?

[adrianSepiol]

First of all, awesome job @adrianSepiol!

Would be there an option to create a graph (nodes and connections) based on a query? for example network topology charts have queries that return a list of nodes and their connections. In that case could this panel create a graph from that information in addition to the manual placement of nodes?

That is something we also discussed and would like to work on in the future, but the idea is to make this work with this spec for the first iteration and then add new functionalities gradually.