Jump to content

Rendered wired behavior


Recommended Posts

(From: https://github.com/pixijs/pixi.js/issues/2344)
Below is a video that shows how sprites come into the canvas, make a straight row on Y axis, and then fly away.

My code(below) dictates, that the finish position for sprites is x=0. So the animation should be finished when all sprites are in the row. Somewhy it flies them to random formations.

My callbacks also indicated, that all animation is indeed finished. But some why, pixi decides to move the sprites after animation is done.

if you change the final animation to finish on x = 3 not 0. Nothing like this happens.
(My code example is done with older version, but same happens with version 3.0.9)


Link to comment
Share on other sites

Its not a pixi problem.

How to do linear animation:

var start_point, end_point;
if (cur_time < totalTime) {
  cur_point.x = (end_point.x - start_point.x) * curTime / totalTime + start_point.x;
  cur_point.y = (end_point.y - start_point.y) * curTime / totalTime + start_point.y;
} else {
  cur_point.x = end_point.x;
  cur_point.y = end_point.y;

Your formulaes are correct too, but they wont work with floating-precision numbers, because you are trying to subtract two close values and divide them by very small number. Not every mathematical function can be computed correctly with floating-precision numbers :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...