Mouseover selection is not cleared

Hi! I’m playing with mouseover/hover animations and have the problem that the selections based on mouseover are not cleared properly when the cursor is moved out of the canvas.

En example using the Bar Chart with Highlighting on Hover and Selection on Click:

Even if I add a padding of 50 to the spec, the hover-selection is not cleared until i move the cursor back into the area enclosed by the axis.

This is especially problematic if the first&last bar are very high because I’m forced to move the cursor carefully.

I could not reproduce that behavior with Javascript’s mouseover/out events on divs: https://codepen.io/keckelt/pen/xxxXQea

[tmori3y2]

In some vega examples, scope is used with click, mousedown, and mousemove to return the valid click position, the drag start position (eg, brush), and the current cursor position within the group’s graph region.

On the other hand, if the source is set to window or view, it is able to get the position outside the graph region, but processing such as clamping with range is required to get a valid position within the graph region.

The following is an example where scope cannot be used.

https://vega.github.io/editor/#/examples/vega/overview-plus-detail

Try replacing

• [@overview:mousedown, window:mouseup] > window:mousemove!"

with

• [@overview:mousedown, scope:mouseup] > scope:mousemove!"

The mouseup capture fails outside the graph region, and the drag state is not cleared even though the mouse is released. (Undocumented !!)

By the way, going back to the examples below,

https://vega.github.io/editor/#/examples/vega-lite/interactive_bar_select_highlight

https://vega.github.io/editor/#/examples/vega-lite/interactive_multi_line_label

On replacing “mouseover” with “view:mousemove” these examples will be working correctly, but on replacing “mouseover” with “window:mousemove” these will be not working.

In the window source, item() does not seem to be evaluated. (Undocumented !!)

In any case, there are documentation issue, but if the definition is clear, in most cases it should work correctly with the correct usage.

Only when the definition is clear can we understand what is a bug and what is a usage problem?

[arvind]

Thanks for the question, @keckelt. You can set "clear": "mouseout" to get the behavior you’re expecting. We could consider doing this automatically if on is set to mouseover but this seems like a very specific condition to hardcode, and we would need to investigate if there are any knock-on effects.