Basic Animation Preview not working

patsej · July 15, 2022, 12:26pm

Hello dear Community!

I have followed the basic example Importing your first Model and Animation | Learn PlayCanvas.
It’s quite straightforward and easy
Here is the project PlayCanvas 3D HTML5 Game Engine

Unfortunately the animation preview is not working on PC (Edge and Chrome). And the frame count does not change (stays at 0)

I see the following error: Failed to construct ‘ImageData’: The input data length is not a multiple of (4 * width).

Where does it come from?
The image size is 1024x1024 and the preview works on the iPad.

What’s more when I launch the project, the animation does not run.

Anyone would have an idea?

Thanks in advance for your help!

Cheers,
Pat

patsej · July 15, 2022, 12:53pm

Quick note: the PC is on Windows 10

yaustar · July 15, 2022, 2:33pm

Hmm, I can’t reproduce this on Mac

yaustar · July 15, 2022, 2:38pm

Also just tried this on my Windows 10 PC with no issue.

Can you share you project please?

patsej · July 15, 2022, 3:22pm

Thanks!
I’m new to Playcanvas. How can I share the project with you?

yaustar · July 15, 2022, 3:55pm

On the project dashboard, just post the URL here

patsej · July 15, 2022, 4:14pm

Is it this one in posted in the first message? PlayCanvas 3D HTML5 Game Engine

Or PlayCanvas | HTML5 Game Engine

patsej · July 15, 2022, 5:47pm

A second question: why doesn’t the animation start when launching ? The state machine should run it, right?

Albertos · July 15, 2022, 9:01pm

Hi @patsej and welcome!

If you define the Root entity as Root Bone, this works as expected.

patsej · July 16, 2022, 8:08am

Hey Albertos,
Yes, this has fixed the animation start when launching. Thanks!

On the other hand, the animation preview is still not working.
Where could it come from? Could you reproduce it on any machine? What does the error mean?

yaustar · July 18, 2022, 9:36am

The preview is working for me in your project:

Did you change anything?

patsej · July 22, 2022, 9:11am

No, I haven’t changed anything.

I’ve just trying with another browser: Firefox.
Same behaviour but a different error:
Uncaught DOMException: Index or size is negative or greater than the allowed amount

with a warning before and after:
WebGL warning: generateMipmap: Tex image TEXTURE_2D level 0 is incurring lazy initialization.

Here is the screenshot:

yaustar · July 22, 2022, 10:09am

Odd, I’m not getting the issue here

Tried both firefox and chrome.

Can you run WebGL Report and post a screenshot please?

patsej · July 22, 2022, 12:59pm

Sure

yaustar · July 22, 2022, 2:55pm

It looks alright to me, very confused why the preview is not working for you

If you remove the texture from the material, does the preview work?

patsej · July 25, 2022, 4:33pm

Thanks for checking. I’ve removed the texture from the material and I still get the error…
Maybe there is an issue with this specific model? I’ll try with another one. Is there a project I could use to check?

yaustar · July 25, 2022, 4:42pm

The model works fine on my machine which is why this is so confusing.

Can you try a different browser like Firefox? Do you have any extensions installed on your browser?

robert.ua · February 3, 2024, 5:28pm

I have the same problem with displaying preview, but it works in the game.

Animation preview cannot render as input data is not a multiple of 4

If preview in anim file

If preview in anim state graph

This is true for both my own model and the Playbot asset from PlayCanvas

Albertos · February 3, 2024, 5:41pm

Hi @robert.ua!

There is already a GitHub issue created for this.

Maybe you can report your case in a reply as well.

github.com/playcanvas/editor

Anim Preview exception, Failed to construct ImageData. The input data length is not a multiple of 4

opened 03:41PM - 23 Mar 23 UTC

yaustar

bug area: animation area: editor interface

Forum https://forum.playcanvas.com/t/animations-suddenly-will-not-play-in-the-ed…itor/30251 <img width="340" alt="image" src="https://user-images.githubusercontent.com/16639049/227256343-21a108ab-ab93-4a2b-9721-db91a63f199e.png"> Looking at the code: ``` // render to canvas const ctx = this._canvas.dom.getContext("2d"); ctx.putImageData( new ImageData(this._renderTarget.pixelsClamped, width, height), (this._canvas.width * this._canvas.pixelRatio - width) / 2, (this._canvas.height * this._canvas.pixelRatio - height) / 2 ); ``` I assume it's here

XiumoXR · February 26, 2024, 9:30am

If this error occurs during the preview of the character placed in the scene, running the project in the browser results in the following bug and the project cannot be started.

viewport-error-console.js:159 TypeError: Cannot read properties of undefined (reading ‘length’)
at Skeleton.addTime (playcanvas-1.68.1.js:35178:35)
at Skeleton.set (playcanvas-1.68.1.js:35287:10)
at Skeleton.set (playcanvas-1.68.1.js:35272:22)
at AnimationComponent.play (playcanvas-1.68.1.js:42671:31)
at AnimationComponent.setModel (playcanvas-1.68.1.js:42700:11)
at ModelComponent.set (playcanvas-1.68.1.js:53950:55)
at ModelComponent._onModelAssetLoad (playcanvas-1.68.1.js:53804:15)
at ModelComponent._bindModelAsset (playcanvas-1.68.1.js:53785:10)
at ModelComponent.set (playcanvas-1.68.1.js:53908:13)
at ModelComponentSystem.initializeComponentData (playcanvas-1.68.1.js:54201:31)