Wie verbinden ein Ereignis mit nur einem Objekt? jqplot

Im mit jqplot zu ziehen, einige Diagramme. Es ist ein großartiges Werkzeug, aber es fehlt ein einfaches clickhandler option für jedes Diagramm.

Seine plugins wie highlighter, ziehbar und cursor-registrieren Sie Ihr Interesse an der Aufnahme klicken Sie auf/Maus-Ereignisse aus der jqplot canvas-Bereich durch das hinzufügen von sich selbst zu jqplot.eventListenerHooks (eventListenerHooks.push(['jqplotClick', callback]); zum Beispiel. oder 'jqplotMouseDown' oder so sind auch verfügbar.

Nachdem mein plot mit der üblichen $.jqplot(target, data, options);
dann Mach ich das

$.jqplot.eventListenerHooks.push(['jqplotClick', myFunc]);

und sicher genug myFunc aufgerufen wird, wo ich klicken Sie auf die Zeichnung, mit event, neighbour, datapos und gridpos. Nachbar ist das interessanteste, es enthält meine Daten, Punkt -, wenn es eine auf es klicken. Das sind die Daten, die ich brauche, um ein popup zu schließen, um die gridpos mit weiteren Informationen auf den Datenpunkt.

Aber das problem ist, wenn ich zwei charts auf der gleichen Seite und registrieren möchten verschiedene callbacks für jeden jqplot. So wie es jetzt ist, wenn ich mich das zweite myFunc2, alle Klicks auf dem zweiten Grundstück, gehen Sie durch die myFunc gut!

Brauche ich, um die änderungen zu jqplot? Alle Richtungen, was auch immer?

Dank

InformationsquelleAutor rapadura | 2010-12-20
  1. 10

    Dies ist nicht gut dokumentiert, aber man kann eine Diskussion darüber hier.

    Grundsätzlich müssen Sie zum erstellen von event Handlern für Ihr Diagramm vor Aufruf von jqplot zum erstellen der aktuellen Grafik. Um das zu tun, müssen Sie etwas tun, wie dieses:

    var handler = function(ev, gridpos, datapos, neighbor, plot) {
    if (neighbor) {
        alert('x:' + neighbor.data[0] + ' y:' + neighbor.data[1]);
    }
};

$.jqplot.eventListenerHooks.push(['jqplotClick', handler]);

    Einfach einen einfachen event-handler, der prüft, um zu sehen, ob es einen benachbarten Datenpunkt in der Nähe, wo Sie geklickt haben. Siehe ein Beispiel hier: http://jsfiddle.net/andrewwhitaker/PtyFG/

    Update: Wenn Sie möchten, hören Sie nur auf Ereignisse, die auf eine bestimmte Handlung, die man tun könnte etwas wie diese:

    var handler = function(ev, gridpos, datapos, neighbor, plot) {
    if (plot.targetId === "#chartdiv") {
        if (neighbor) {
            alert('x:' + neighbor.data[0] + ' y:' + neighbor.data[1]);
        }
    }
    else if (plot.targetId === "#chart2div") {
        ....
    }
    //etc...
};

    Wo würden Sie ersetzen #chartdiv mit was auch immer die Id des Diagramms, den Sie hören möchten, um Ereignisse für ist. Das Beispiel wurde aktualisiert.

    Update 2: Sieht aus wie Sie können einen regulären bind Veranstaltung mit der plot-Ereignisse:

    $("#chartdiv").bind("jqplotClick", function(ev, gridpos, datapos, neighbor) {
    if (neighbor) {
        alert('x:' + neighbor.data[0] + ' y:' + neighbor.data[1]);
    }
});

    Beispiel zur Verwendung dieser Methode mit 2 charts:

    http://jsfiddle.net/andrewwhitaker/PtyFG/5/

    Hoffe, das hilft!

    • Dank Andrew! Ich verdeutlichte meine Frage, während Sie, wo Sie Antworten, arbeitete ich dies und es funktioniert großartig, wenn Sie Zeit haben, siehe mein Beitrag oben. Wie mache ich für zwei charts, wo jeder hat unterschiedliche handler? Oh, und danke für die links! Checkin Sie jetzt heraus.
    • Kein problem, nur aktualisiert, meine Antwort.
    • Ah! Ich habe gedacht, aber es scheint wie eine nicht so schöne Lösung. Die Veranstaltung ist an beiden Diagramme. Ich Suche jetzt auf bitbucket.org/cleonello/jqplot/src/a806b42e34e2/examples/... versucht es zum laufen zu bringen...
    • Vereinbart, es ist hässlich. Hinzufügen andere Lösung...
    • Gah! Scheint die DateAxisRenderer Im mit nicht handleClick.
    • Vielen Dank Andrew!! Ich war eingeschneit auf die Bindung an jqplotDataClick. Doh!
    • Kein problem, bin froh, dass ich helfen konnte.

    InformationsquelleAutor Andrew Whitaker
Schreibe einen Kommentar