Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Animation on 3d scatter plot #9

Open
mapmeld opened this issue Sep 10, 2018 · 1 comment
Open

Animation on 3d scatter plot #9

mapmeld opened this issue Sep 10, 2018 · 1 comment

Comments

@mapmeld
Copy link

mapmeld commented Sep 10, 2018

Hi,
I'm using this library and it is doing wonders for us.
Currently I am able to show two states on our 3D scatter plot by showing and hiding two separate collections of dots, something like this:

dots1.push({x: x1, y: y1, z: z1});
dots2.push({x: x2, y: y2, z: z2});

...
function dragged(){
        ...
        var data = [
           grid3d.rotateY(beta + startAngle).rotateX(alpha - startAngle)(xGrid),
           point3d.rotateY(beta + startAngle).rotateX(alpha - startAngle)(mode ? dots1 : dots2)
       ];
       processData(data, 0);
}
toggle.onClick = dragged;

I would like to animate dots moving between the two states.

As I understand it, d3-3d calculates d.projected.x and d.projected.y for all of the data, and then cx and cy are set to draw as if it's in 3d space.

To draw cx and cy during a transition, I'd like to access x2,y2,x2, either as d.projected.x2, or projected(d.x2). Is there a clean way like this, without maintaining both sets and checking the others' calculated position, with something like dots2.filter((d2)=> { d2.id === d.id })[0].projected.x ?

@Niekes
Copy link
Owner

Niekes commented Jan 15, 2024

Do you use d3.js to handle your animations?

Please take a look at the examples how animations are normally managed with d3-3d.js and d3.js.

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

No branches or pull requests

2 participants