如何将事件与一个对象关联？ jqplot

问题描述

Im使用jqplot绘制一些图表。这是一个伟大的工具，但它缺乏一个简单的clickhandler选项为每个图表。

Im using jqplot to draw some charts. It is a great tool, but it lacks a simple clickhandler option for each chart.

它的插件如荧光笔，可拖动和光标通过将自己添加到jqplot.eventListenerHooks（eventListenerHooks.push（[

Its plugins like highlighter, draggable and cursor register their interest in capturing click/mouse-events from the jqplot canvas by adding themselves to jqplot.eventListenerHooks (eventListenerHooks.push(['jqplotClick', callback]); for example. or 'jqplotMouseDown' or such are also available.

在使用通常的$ .jqplot（target，data）生成我的情节之后，我们可以使用'jqplotClick'或'jqplotMouseDown' ，options）;
然后我这样做

After making my plot with the usual $.jqplot(target, data, options);then I do this

c> $

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

， neighbor ， datapos 和 gridpos 有趣的是，它包含我的数据点，如果有一个点击它。这是我需要做一个弹出接近gridpos与数据点上的附加信息。

and sure enough myFunc gets called wherever I click on the plot, with event, neighbour, datapos and gridpos. Neighbour is the most interesting, it contains my data point if there was a click on it. This is the data I need to make a popup close to the gridpos with aditional information on the datapoint.

但是问题是如果我在同一页上有两个图表，并想为每个jqplot注册不同的回调。就像现在一样，当我注册第二个myFunc2时，第二个绘图上的所有点击都通过myFunc aswell！

But the problem is if I have two charts on the same page and want to register different callbacks for each jqplot. As it is now, when I register the second myFunc2, all the clicks on the second plot go through the myFunc aswell!

我需要对jqplot进行更改吗？

Do I need to make changes to jqplot? Any directions, whatsoever?

感谢

推荐答案

有详细记录，但您可以在找到相关讨论。

This isn't well-documented, but you can find a discussion about it here.

基本上，您需要在之前为图表创建事件处理程序，然后调用jqplot创建实际图表。要做到这一点，你需要这样做：

Basically, you need to create event handlers for your chart before calling jqplot to create the actual chart. To do that, you need to do something like this:

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

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

这只是一个简单的事件处理程序，它检查附近有没有邻近的数据点。请参阅这里的工作示例：

That's just a simple event handler that checks to see if there's a neighboring data point near where you clicked. See a working example here: http://jsfiddle.net/andrewwhitaker/PtyFG/

更新：如果您只想听某个剧情中的活动，可以这样做：

Update: If you want to only listen to events on a certain plot, you could do something like this:

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是。示例已更新。

Where you would replace #chartdiv with whatever the Id of the chart you want to listen to events for is. The example has been updated.

更新2：看起来您可以使用常规绑定 event with the plot events：

Update 2: Looks like you can use a regular bind event with the plot events:

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

使用此方法的示例，包含两个图表：

Example using this method, with 2 charts:

希望有所帮助！

这篇关于如何将事件与一个对象关联？ jqplot的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！