I am working with Autodesk Viewer in a web application, and I need to change the cursor to a loading (wait) icon during long-running operations. When selecting part of a model for example.
I am looking for a way to manipulate the cursor style within the Autodesk Viewer container.
I have tried setting it in the CSS, but doesn't seem to have any effect.
.loading-cursor {
cursor: wait;
}
I know in the documentation there are calls like getCursor() so I was thinking to try that but if anyone has any insight please let me know.
You need to override the existing custom cursor style that's applied to the canvas element.
The canvas element is located as a child element of the viewer div element (see screenshot)
Here's some example code to do it:
function setLoadingCursor(isLoading) {
const canvasElement = viewerContainer.querySelector('canvas');
if (canvasElement) {
if (isLoading) {
canvasElement.style.cursor = 'wait';
} else {
canvasElement.style.cursor = ''; // Reset to default cursor
}
}
}