Browser and Browser Version: Last Chrome or chromium current version
After Effects last 2023 version
I made a template in AE composed of images, texts and shapes.
Everything works fine except that I want be able to update dynamically images, as I do with text.
But I couldnt, and didn't find a lot of infos for such a common idea...
Here is my code to start the anim : Where did I lost myself please ?
setTimeout(function () { var animElementsLength = anim.renderer.elements.length; for (let i = 0; i < animElementsLength; i++) { var animElement = anim.renderer.elements[i]; if ( animElement.hasOwnProperty('data') && animElement.data.hasOwnProperty('cl') && content && content.hasOwnProperty(animElement.data.cl) ) { var cl = animElement.data.cl; try { animElement.canResizeFont(true); // Let lottie resize text to fit the text box animElement.updateDocumentData({ t: content[cl] ? content[cl].text || content[cl] : '' }, 0); } catch (err) {} } } var animAssetsLength = anim.assets.length; for (let i = 0; i < animAssetsLength; i++) { var imgEl = anim.assets[i]; if ( imgEl.hasOwnProperty('id') && content && content.hasOwnProperty(imgEl.id) ) { var img = img try { anim.updateBitmap(img, content[img]) } catch (err) {} } } anim.playSegments([animSettings.play.in, animSettings.play.out], true); }, 150);
I Find out another way to update image sources : giving those a class name in AE, and then in my update script : $(document).find('.Team1').find('image').attr('href',newvalue)
environment: html5 app (NodeJS Expressjs jquery socketio)
Browser and Browser Version: Last Chrome or chromium current version After Effects last 2023 version
I made a template in AE composed of images, texts and shapes.
Everything works fine except that I want be able to update dynamically images, as I do with text. But I couldnt, and didn't find a lot of infos for such a common idea...
Here is my code to start the anim : Where did I lost myself please ?
setTimeout(function () { var animElementsLength = anim.renderer.elements.length; for (let i = 0; i < animElementsLength; i++) { var animElement = anim.renderer.elements[i]; if ( animElement.hasOwnProperty('data') && animElement.data.hasOwnProperty('cl') && content && content.hasOwnProperty(animElement.data.cl) ) { var cl = animElement.data.cl; try { animElement.canResizeFont(true); // Let lottie resize text to fit the text box animElement.updateDocumentData({ t: content[cl] ? content[cl].text || content[cl] : '' }, 0); } catch (err) {} } } var animAssetsLength = anim.assets.length; for (let i = 0; i < animAssetsLength; i++) { var imgEl = anim.assets[i]; if ( imgEl.hasOwnProperty('id') && content && content.hasOwnProperty(imgEl.id) ) { var img = img try { anim.updateBitmap(img, content[img]) } catch (err) {} } } anim.playSegments([animSettings.play.in, animSettings.play.out], true); }, 150);