Stack Overflow
Stack Overflow

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

bodymovin: converting .JSON to .SVG?

My question: Is there a way to convert .json to .SVG My situation: I have created animation adobe after effects, i then output a file using Bodymovin extension in after effects I get the a .json file, and a html file that will show the animation…
james larkin
  • 7
  • 1
  • 3
0
votes
0 answers

Play Bodymovin animation on parent element hover

I have two cards with an animated icon in them. When I hover over the icon, the animation starts playing. Now I want the icon to animate when the card is hovered, not the icon itself. I already tried out different options, but that didn't work.…
Colin Chadwick
  • 146
  • 9
0
votes
0 answers

Bodymovin - Lottie in Rails project : json in not found

As in the tutorial here : https://aescripts.com/bodymovin/ I try to render my svg in my rails project. I think I can find the player but not the json : My typescript file looks like this : const bodymovin =…
Dips
  • 109
  • 1
  • 10
0
votes
1 answer

Controlling a Lottie Animation with ScrollMagic and TimelineMax

I'm trying to use ScrollMagic to control a TimelineMax which moves the playhead of a Lottie animation. So, as the user scrolls, the animation plays relative to the speed and direction of the scroll. I'm so close and need a little help to bring the…
Dave Merwin
  • 1,382
  • 2
  • 22
  • 44
0
votes
1 answer

React + Lottie Animation scroll fire

I created different animation thought Bodymovin. I would like to fire the animation once the scroll reach the animation. I am trying to figure out the way, but unfortunately I am not able to do it. I am working with Gatsby JS (React framework). I…
JFelix
  • 135
  • 3
  • 10
0
votes
2 answers

lottie animation on complete fade out

I have a lottie animation playing one time. When it completes playing I want to fade it out. What is the best way to do it? I am trying to fade in and out SVG lottie animations. var params = { container: document.getElementById('lottie'), …
Wisp Ever
  • 35
  • 6
0
votes
1 answer

Why can't I use Lottie in an Ionic 4 app?

I'm trying to get Lottie/Bodymovin' integrated into an Ionic 4 app and I'm having no luck. Currently I'm running: "@ionic/angular": "4.1.0" "@angular/core": "~7.1.4" "ng-lottie": "0.3.1" The error I'm getting is: ERROR DOMException: Failed to…
Michael Christopher Martire
  • 220
  • 1
  • 3
  • 21
0
votes
1 answer

Are there Tags that could solve this?

New to coding, trying to see what/if Tags would make this code work So I'm a beginner with basic understanding and more of a Graphics/ Designer than code based. I found a codepen by WEDOO that has exactly what I need and want to try to just swap my…
Nyeusi_Tech
  • 25
  • 3
0
votes
1 answer

Lottie animation in Ionic v1 project

I am updating an existing project made with Ionic v1 in which I have to add a Lottie animation. I found a similar thread on Github - https://github.com/yannbf/ionic-lottie/issues/1 I tried to add bodymovin script in my index.html, and calling the…
Marija
  • 31
  • 1
  • 7
0
votes
2 answers

Play a Lottie / Bodymovin animation on scroll on an HTML web page

I have been searching multiple forums looking for a solution to this problem- I am trying to code multiple lottie animations to play when each animation enters the browser window on an HTML web page. Does anyone have a working solution? I have tried…
Jaron Johnston
  • 1
  • 1
  • 1
  • 1
0
votes
0 answers

Exporting with Bodymovin does not work as expected

I am a newbie to After Effect CC 2018, I have composition which consists of 3 animated video and 1 texture. Then, I export it as JSON using bodymovin extension. Then, I upload the json to lottiefiles.com for Preview, but only the texture display,…
Duy Tan Duong
  • 1
0
votes
2 answers

Parent DIV's CSS interferes with SVG animation

We've moved an SVG/JS animation created with the Adobe After Effects Bodymovin plugin from one Wordpress site to another. On the old site (which I unfortunately can't show you), the animation works flawlessly. On the new site, depending on the size…
clayRay
  • 683
  • 1
  • 14
  • 32
0
votes
1 answer

bodymovin translateZ();

I created the following animation using aftereffects: https://i.stack.imgur.com/z3nBp.jpg There is a button on after effects that was used to set the movement along the z-axis: https://i.stack.imgur.com/h9wcJ.jpg I believe it is this…
grey krav
  • 45
  • 10
0
votes
1 answer

How Do I Delay a Bodymovin Animation

Ok so I just started using bodymovin and was wondering if there was a way for me to delay the animation. My web page fades in so during that fade in the animation is happening which is not what i would like. So if I could delay it by 2 seconds that…
ethanfox27
  • 890
  • 1
  • 9
  • 25
0
votes
3 answers

Lottie Animation in fabricjs canvas

Is it possible to load the Lottie animation in fabricjs canvas I have tried the following samples bodymovin.loadAnimation({ wrapper: animateElement, // div element loop: true, animType: 'canvas', …
Balasubramani Samiyappan
  • 98
  • 12
1 2 3 4
5
6 7