jQuery flot mouseleave does not work for me

I've modify my jQuery.flot.js and flot.pie.js a bit, to make a mouseleave effect on my pie canvas.

at line 585 flot.pie.js

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

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

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

at line 127 flot.pie.js

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

in my javascript mysite.html

$("#graph1").bind("plothover", pieHover);
$("#graph1").bind("plotleave", pieLeave);
$("#graph1")开发者_开发技巧.bind("plotclick", pieClick);

the functions 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 + '%');
}

My pieLeave function is totally ignored. What is the problem? Thanks for the help.

More information: flot example

Okay, happened. You simply can't use the mouseleave on the plot because the plot is the whole canvas container, the only way to do this if binds everything to mousemove and check the object's 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");
    }
}