Skip to content

Conversation

@dave-artificial-agency
Copy link
Contributor

@dave-artificial-agency dave-artificial-agency commented Oct 16, 2025

Hello - What do you think about exposing some library functions to move and adjust the canvas, for easier viewing?

My use case: We work with some Unreal Blueprints + Event Graphs that are quite large - 100+ nodes and screenshots that are 15,000 pixels tall or wide, or more.

klee is excellent at helping us better display these sizes of Blueprint.
But it would also be helpful to be able to quickly move around and view different parts of the canvas.

This PR proposes adding a few methods to expose klee camera behaviour:

zoomIn()
zoomOut()
resetZoom()

This makes it easy to add some javascript UI controls in the HTML page to let the reader easily move around and zoom.
e.g. I can add some javascript like

const canvas = document.getElementById(canvasId); // each klee canvas on the page gets a UUID

if (canvas && window && window.KleeApplication && window.KleeApplication.getInstance) {
  app = window.KleeApplication.getInstance(canvas);
}

...

app.resetZoom();
app.zoomIn();
app.zoomOut();

With some buttons:

klee - zoom control ui buttons

Do you often use klee to work with large Blueprints like this?

Tests:

  • Can manually move the canvas around with the right mouse to view nodes (same as normal)
  • Can click some 'zoom in' and 'zoom out' buttons to call these exposed methods, and zoom the canvas

this._scene.camera.resetZoom();
this.refresh();
return true;
}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The existing recenterCamera() method returns true, so I followed the same pattern here for the zoom functions.
I can convert the methods to void if you prefer.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant