Questions tagged [bodymovin]

Bodymovin is an AfterEffects extension that exports animations to SVG or Canvas. Questions related to it should deal with implementation on the JavaScript/SVG/Canvas side, not about AfterEffects itself

Bodymovin is an AfterEffects extension that exports animations to SVG or Canvas. Questions related to it should deal with implementation on the JavaScript/SVG/Canvas side, not about AfterEffects itself. To report bugs inside of Bodymovin, create an issue on GitHub.

93 questions
0
votes
1 answer

How to use "webpack.DefinePlugin" with React Gatsby and React-Bodymoving?

I am pretty new to React but I want to set BODYMOVIN_EXPRESSION_SUPPORT in Webpack's Define plugin with Gatsby v1. I followed the links below but I don't get what exactly I suppose to…
Tats
  • 69
  • 1
  • 2
  • 10
0
votes
0 answers

how to destroy animation in bodymovin react

So I'm trying to destroy the animation in my react app but it is not destroying if I use any event listener I get the errors I don't know why, here is the code import React, { Component } from 'react'; import './Cool.css'; import data from…
Muhammad Usman
  • 135
  • 3
  • 9
0
votes
2 answers

Triggering a Lottie animation onScroll

im currently building a website using fullpage js and lottie animations. Now im trying to trigger an animation when the user scrolls to the section with the animation. Here is what i tried: (please note that im very new to…
0
votes
0 answers

Import Adobe After Effect animation to xcode

I have some trouble importing my animation from Adobe After Effect to Xcode and web. I have made a character and rigged it with the Duik-plugin. I made the annimation i would like to get into xcode, and rendered it to JSON using bodymovin. I have an…
Lasse Bickmann
  • 195
  • 3
  • 14
0
votes
1 answer

How to integrate bodymovin animations with functions?

I have a question regarding bodymovin & react (or actually also plain/vanilla html&js). Say a graphic / motion designer gives me a animation of a searchfield opening up. Like this one. I then want to integrate this animation into my website, so that…
George Welder
  • 3,787
  • 11
  • 39
  • 75
0
votes
1 answer

Error on bodymovin animation in react native?

I am using sample.json image file which is for bodymovin animation in my page through Lottie for React Native. I am getting the image but the image is not fully retrieved, some parts of the image is missing and also in some side of the image, green…
user1731387
0
votes
1 answer

Bodymovin shows wilder animation

We have created some animation with Body Movin, all of them works great. The problem we have now is, the Body Movin animation animate really wild compared to what it supposed to animate. Original Animation: Bodymovin Animation: You can test and…
AlbertSamuel
  • 584
  • 10
  • 33
0
votes
1 answer

bodymovin in Angular4, fixing appendChild of undefined

I'm using the bodymovin script in my project. Even though some of my animated SVG's are rendering in the browser, I'm still getting this error Uncaught TypeError: Cannot read property 'appendChild' of undefined at SVGRenderer.configAnimation…
bluebrooklynbrim
  • 277
  • 4
  • 19
0
votes
1 answer

empty JSON export with after effects + bodymovin for Lottie

I have a basic animation in After Effects, installed bodymovin (without any errors), and would like to export as a Lottie Animation. But all I get when exporting is an empty JSON file. I do select my composition during the export of course and I…
ezmegy
  • 605
  • 6
  • 17
0
votes
1 answer

How to do scrollevent for bodymovin and control animation?

I want to trigger animations on scroll for bodymovin [JSON] which can be controlled on scroll i.e forward and reverse as well. Alfred , Need similar kind of behavior . Suggestions are welcome , How should I approach this OnScroll events ?
0
votes
3 answers

how to check if bodymovin animation is complete?

I want the to destroy the animation when is complete animating. tried addEventListener that didn't work. anim = bodymovin.loadAnimation(params); animContainer.addEventListener("complete", myScript); function myScript(){ anim.destroy(); }
Siyanda Cele
  • 35
  • 1
  • 8
0
votes
2 answers

How to trigger function on scroll

I have a few animations that I want to trigger when I've scrolled past a certain point in the page. I don't think I have the right syntax for calling my animation function with the scrollTop property. I tested it with alert and it worked fine. var…
phantomboogie
  • 113
  • 1
  • 7
0
votes
1 answer

toggling a mouseenter event

I have an animation using bodymovin that triggers when I mouseenter it and I'm trying to make it so that if I mouseover it again before the animation ends, it doesn't restart. squareAnim.addEventListener('mouseenter',…
phantomboogie
  • 113
  • 1
  • 7
0
votes
1 answer

Responsive Bodymovin animation

How do I embed a bodymovin exported file to be responsive, yet keep the correct aspect ratio of logo and fonts, and fit to the boarders of my website? Any ideas? Thank you in advance
Patrick
  • 31
  • 3
0
votes
0 answers

Animation plays while mouseover and stops when mouseout

I'm newbie. I got a code which is working well, but how can I make it playable while mouseover and stopable when mouseout in JavaScript(jQuery). Also I want that when we'll mouseover again an animation start from start. I added a couple lines such…
Tai Raise
  • 9
  • 2