HTML5 templates, bodymovin - Changing the json data using pre-compositions

Hello all,

I’m trying to make the switch from Flash templates to HTML5 templates.
After reading different topics on the forum, i have started with bodymovin to create the graphics.

At this moment, i succeeded in creating a flat template from bodymovin, and changing the values in the bodymovin .json file that i get from caspar using the function updateDocumentData.

But the only elements i can change are the elements that are in the main composition of After Effects. Now i would like to try and make a more difficult template where i work with pre-compositions in After Effects. How can i use updateDocumentData (or another function?) to change text values in deeper compositions.

       function functionUpdate() {
            anim.playSegments([450, 460], true);
            const animElement = anim.renderer.elements[1];
            console.log(anim.renderer.elements[1])
            animElement.updateDocumentData({t: 'Test Text'});
        }

        const animData = 'js/data_test.json';
        const animContainer = document.getElementById('lottie-container');
        const anim = lottie.loadAnimation({
            container: animContainer, // The dom element that will contain the animation
            renderer: 'svg',
            loop: false,
            autoplay: false,
            path: animData // Path to the animation json
        });
Privacy Policy   Terms of Service