Диаграмма Hoverable Пончик не теряет бликов, когда мышь покидает график - PullRequest
Новая
       22

Диаграмма Hoverable Пончик не теряет бликов, когда мышь покидает график

0 голосов
/ 27 февраля 2012

У меня возникла следующая проблема, которую можно воспроизвести даже на главной странице примера Flot,

И мне было интересно, есть ли способ ее преодоления.

Описание проблемы: настройкакольцевую диаграмму и использование на ней grid: { hoverable: true }.

Следующим шагом является размещение диаграммы внутри некоторого элемента div, чтобы верхняя и нижняя границы кольцевой диаграммы почти касались границ элемента div, теперь ... когдая наведу кусочки пончика, на которые они подсвечиваются, НО ... если я "сдвину" мышь БЫСТРО от графика, подсвеченный срез не потеряет свой подсвеченный ... (что выглядит плохо)

МожетВоспроизвести здесь Примеры Flot Pie

Просто перейдите к нижнему примеру (Donut), поместите мышь над нижним или верхним срезом и быстро оставьте мышкой, заметьте, что срезвсе еще выделено

Я могу сказать, когда мышь покидает контейнер графика (используя событие mouseleave), но как мне избавиться от выделения?

Спасибовпереди!

1 Ответ

2 голосов
/ 27 февраля 2012

Ну, к сожалению, плагин пирога не предоставляет никаких методов, которые позволили бы вам остаться в стороне.В общем, если плагин был написан более разумно, вы могли бы позвонить plot.unhighlight() на указателе мыши вашего div-элемента-заполнителя ... Но это не идеальный мир, поэтому вместо этого вы должны сделать что-то неприятное, как это: 

$("#interactive").mouseleave(function() {
    var e = jQuery.Event('mousemove');
    e.pageX = 1;
    e.pageY = 1;
    $('#interactive canvas:first').trigger(e);
});​

Вы устанавливаете pageX и pageY как нечто такое, что, как вы уверены, никогда не будет частью пирога, а затем это генерирует событие перемещения в этом месте, которое обманывает пирог в неприличном свете.Если у вас также есть настройка событий щелчка, вам может потребоваться также создать событие щелчка в том же месте (просто измените mousemove на click.

Смотрите его в действии здесь: http://jsfiddle.net/ryleyb/9LdKg/

...