Skip to content
This repository has been archived by the owner on Jan 5, 2021. It is now read-only.

AFrame has dropped support for Tween, example with anime.js #13

Open
netgfx opened this issue Nov 4, 2020 · 1 comment
Open

AFrame has dropped support for Tween, example with anime.js #13

netgfx opened this issue Nov 4, 2020 · 1 comment

Comments

@netgfx
Copy link

netgfx commented Nov 4, 2020

After some hours I was able to animate a spritesheet correctly with anime.js. I'm leaving this here in case it helps someone.

function animateBlast() {
    var target = document.querySelector("#blastObj");
    var animation = {
      targets: "#blastObj sprite-sheet",
      progress: [0, 1], // from 0 to 1
      duration: 240,
      autoplay: true,
      easing: "linear",
      direction: "normal",
      loop: false,
      update: function(anim) {
        target.setAttribute("sprite-sheet", "progress", Math.round(anim.progress)/100);
      },
      begin: function(anim) {
        target.setAttribute("visible", true);
      },
      complete: function(anim) {
        target.setAttribute("sprite-sheet", "progress", 0);
      }
    };

    var tween = new AFRAME.ANIME(animation)
  }
@netgfx
Copy link
Author

netgfx commented Nov 5, 2020

If you want me to make a PR modifying the examples I'll be happy to.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant