SVG dot don't include jitter applied in webGL

[David Mora]

How to reproduce:

1. Encode aesthetics x or y to a give field & render scatter. Hover works properly.
2. Update to a different field. Do this by directly setting a new x or y property (using x0 or y0 doesn't make a difference)
3. Now hover a point. Notice that the SVG dot has renders at the previous coordinates, not the new one based on the new field.

The underlying issue:

Imagine we change from encoding y as y_field_1 to y_field_2.

After the update, we'd see that the y aesthetic instance seems to remain out of date:

deepscatter/src/interaction.ts

Line 179 in 195e844

 const y_aes = renderer.aes.dim('y').current; 

...

deepscatter/src/interaction.ts

Lines 229 to 230 in 195e844

 .attr('cx', (datum) => x_(x_aes.value_for(datum))) 
 .attr('cy', (datum) => y_(y_aes.value_for(datum))), 

where the value of y_aes.field === 'y_field_1' still.

This is surprising because if you check during execution field is being correctly updated here:

deepscatter/src/Aesthetic.ts

Line 451 in 195e844

 this.field = encoding.field; 

TODO: look further into why that update isn't showing up later when we're setting the SVG circle position.

Images of an example of updating y:

Note in the second image, I'm hovering the new location of the purple dot, as indicated by a correctly positioned tooltip (which uses mouse position, I think)

[David Mora]

I've noticed a similar behaviour when jitter is applied

[Benjamin Schmidt]

All right, thanks for the note--I think this should now be fixed by moving these two lines of code inside a callback function from outside.. If you encounter it again, let me know.

---

Jitter is a bit more complicated. Fully placing points that are jittered would involve:

1. Animating them along the paths they take in webgl;
2. Accessing the jittered coordinates, which are created by random number calculations on the GPU that can't be reproduced off it.

It would, all in all, usually be easier to actually make an additional draw call in webGL than to try to extract this state information and update it every tick, so I'm going to change the name of this issue to reflect that it's not supported but not promise to support it at any point soon..

[David Mora]

@bmschmidt that makes!

Yeah the jitter issue seems small -- at worst a consumer could just hardcode a jitter into the dataset and encode it directly, or simply twaek the library to hide the SVG dot during times of jitter.