juliangarnier / anime

JavaScript animation engine

Home Page:https://animejs.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

get continues position (x,y) from moving SVG object

bartatgithub opened this issue · comments

Is your feature request related to a problem? Please describe.
The problem is that I cannot find anywhere in the documentation how to obtain continuous position (x,y) of a moving object. And to further use this position (x,y) in another Javascript. So I assume this is not (yet) implemented in Anime.js.

Describe the solution you'd like
A way to continuously obtain the position (x,y) of a moving object and a way to use this in another Javascript.
For now to be used specifically in the SVG Motion path example of yours but would be useful in different projects using Anime.js.

Describe alternatives you've considered
Tried using basic Javascript to obtain the position of the animated div but doesn't work so far.

Thanks to help me out on this!

commented

Why basic JavaScript to obtain position doesn't work? It should work.

Please post a code example.

// jQuery:
let positionLeft = $('.box').css('left');

// Plain JavaScript:
let box = document.querySelector('.box').getBoundingClientRect();

You can also animate plain object with anime.js and in update() set CSS.

Hello

Sorry for late reply, meanwhile I had already obtained what I urgently needed with 'vector.js'.

Will definitely try your suggestion here one of these days.

Strange though that this should be done via a 'document.querySelector' on the element?
Shouldn't it be directly readable via a function that reads the position via your library?

Thanks!