如何将事件与仅一个对象相关联?jqplot [英] How to associate an event with only one object? jqplot
问题描述
我正在使用 jqplot 绘制一些图表.这是一个很棒的工具,但它缺少每个图表的简单点击处理程序选项.
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(['jqplotClick', callback]); 来记录他们对从 jqplot 画布捕获单击/鼠标事件的兴趣.'jqplotMouseDown' 等也可用.
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, options); 制作我的情节之后然后我这样做
After making my plot with the usual $.jqplot(target, data, options); then I do this
$.jqplot.eventListenerHooks.push(['jqplotClick', myFunc]);
果然无论我在哪里点击绘图,myFunc 都会被调用,使用 event
、neighbour
、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!
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]);
这只是一个简单的事件处理程序,用于检查您单击的位置附近是否有相邻的数据点.在此处查看一个工作示例:http://jsfiddle.net/andrewwhitaker/PtyFG/
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: 看起来您可以将常规 bind
事件与情节事件一起使用:
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]);
}
});
使用此方法的示例,带有 2 个图表:
Example using this method, with 2 charts:
http://jsfiddle.net/andrewwhitaker/PtyFG/5/
希望有帮助!
这篇关于如何将事件与仅一个对象相关联?jqplot的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!