6

jqplotを使用していくつかのグラフを描画しています。これは優れたツールですが、グラフごとに単純なクリックハンドラオプションがありません。

蛍光ペン、ドラッグ可能、カーソルなどのプラグインは、jqplot.eventListenerHooks（eventListenerHooks.push（['jqplotClick'、callback]）;または'jqplotMouseDown'に追加することで、jqplotキャンバスからクリック/マウスイベントをキャプチャすることへの関心を登録します。またはそのようなものも利用可能です。

通常の$.jqplot（target、data、options）;でプロットを作成した後。それから私はこれをします

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

eventそして、プロットをクリックするとneighbour、、、、dataposおよびで、十分なmyFuncが呼び出されることを確認してくださいgridpos。隣人は最も興味深いです、それをクリックした場合、それは私のデータポイントを含んでいます。これは、データポイントに関する追加情報を含むポップアップをグリッド位置の近くに作成するために必要なデータです。

しかし、問題は、同じページに2つのグラフがあり、jqplotごとに異なるコールバックを登録したい場合です。現在のように、2番目のmyFunc2を登録すると、2番目のプロットのすべてのクリックもmyFuncを通過します。

jqplotに変更を加える必要がありますか？どんな方向性、何でも？

ありがとう

4

1 に答える 1

10

これは十分に文書化されていませんが、ここでそれについての議論を見つけることができます。

基本的に、 jqplotを呼び出して実際のグラフを作成する前に、グラフのイベントハンドラーを作成する必要があります。これを行うには、次のようなことを行う必要があります。

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

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

これは、クリックした場所の近くに隣接するデータポイントがあるかどうかを確認する単純なイベントハンドラーです。ここで実際の例を参照してください：http：//jsfiddle.net/andrewwhitaker/PtyFG/

更新：特定のプロットのイベントのみを聞きたい場合は、次のようにすることができます。

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...
};

#chartdivイベントを聞きたいチャートのIDをどこに置き換えるかはどこにありますか。例が更新されました。

更新2：bindプロットイベントで 通常のイベントを使用できるようです：

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

この方法を使用した例、2つのグラフ：

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

お役に立てば幸いです。

于 2010-12-20T17:34:39.867 に答える