У меня не работает jQuery flot mouseleave - PullRequest
Новая
       25

У меня не работает jQuery flot mouseleave

1 голос
/ 14 апреля 2011

Я немного изменил jQuery.flot.js и flot.pie.js , чтобы создать эффект отпускания мышью на моем круговом холсте.

в строке 585 flot.pie.js 

function onMouseMove(e) {
    triggerClickHoverEvent('plothover', e);
}

function onMouseLeave(e) {
    triggerClickHoverEvent('plotleave', e);
}

function onClick(e) {
    triggerClickHoverEvent('plotclick', e);
}

в строке 127 flot.pie.js 

if (options.series.pie.show && options.grid.hoverable) {
    eventHolder.unbind('mousemove').mousemove(onMouseMove);
    eventHolder.unbind('mouseleave').mouseleave(onMouseLeave);
}

в моем JavaScript mysite.html 

$("#graph1").bind("plothover", pieHover);
$("#graph1").bind("plotleave", pieLeave);
$("#graph1").bind("plotclick", pieClick);

функции mysite.html 

function pieHover(event, pos, obj) {
    if (!obj) return;
    var what = obj.series.name;
    $("a[name=" + what + "]").addClass("hover");
    $("#world #" + what + " path", svg.root()).attr("fill", "url(#orange)");
    $("#world #" + what + " path.water", svg.root()).attr("fill", "#92D7E7");
}

function pieLeave(event, pos, obj) {
    if (!obj) return;
    var what = obj.series.name;
    $("a[name=" + what + "]").removeClass("hover");
    $("#world #" + what + " path", svg.root()).attr("fill", "#68CDF2");
    $("#world #" + what + " path.water", svg.root()).attr("fill", "#B9E4EE");
}

function pieClick(event, pos, obj) {
    if (!obj) return;
    percent = parseFloat(obj.series.percent).toFixed(2);
    alert('' + obj.series.label + ': ' + percent + '%');
}

Моя функция pieLeave полностью игнорируется.В чем проблема?Спасибо за помощь.
Дополнительная информация: пример flot

1 Ответ

2 голосов
/ 17 апреля 2011

Хорошо, случилось. Вы просто не можете использовать указатель мыши на графике, потому что график - это целый контейнер холста, единственный способ сделать это, если привязать все к перемещению мыши и проверить объект na 

function pieHover(event, pos, obj) 
    {
    if (!obj) { // if no object (move out of the plot, clear everything)
    $("a").removeClass("hover");
    $("#world g path", svg.root()).attr("fill", "#68CDF2");
    $("#world g path.water", svg.root()).attr("fill", "#B9E4EE");
    //      return;
    }
    else { // clear everything, do something.
    what = obj.series.name;
    $("a").removeClass("hover");
    $("#world g path", svg.root()).attr("fill", "#68CDF2");
    $("#world g path.water", svg.root()).attr("fill", "#B9E4EE");
    $("a[name="+what+"]").addClass("hover");
    $("#world #"+what+" path", svg.root()).attr("fill", "url(#orange)"); 
    $("#world #"+what+" path.water", svg.root()).attr("fill", "#92D7E7");
    }
}
...