这里最难的事情是知道用户何时拖动一个点,而不是事后获取数据。我建议您使用 postDrawSeries 挂钩,如下所示:
$(document).ready(function () {
// set up plot
$.jqplot.config.enablePlugins = true;
s1 = [['23-May-08',1],['24-May-08',4],['25-May-08',2],['26-May-08', 6]];
plot1 = $.jqplot('chart1',[s1],{
title: 'Highlighting, Dragging, Cursor and Trend Line',
axes: {
xaxis: {
renderer: $.jqplot.DateAxisRenderer,
tickOptions: {
formatString: '%#m/%#d/%y'
},
numberTicks: 4
},
yaxis: {
tickOptions: {
formatString: '$%.2f'
}
}
},
highlighter: {
sizeAdjust: 10,
tooltipLocation: 'n',
tooltipAxes: 'y',
tooltipFormatString: '<b><i><span style="color:red;">hello</span></i></b> %.2f',
useAxesFormatters: false
},
cursor: {
show: true
}
});
// add our hook, to fire after a series update
$.jqplot.postDrawSeriesHooks.push(updatedSeries);
function updatedSeries(sctx, options) {
console.log(plot1.series[0].data); //data for the series is here
}
});
每次拖动的输出为(包含更新的数据点):
[
Array[2]
,
Array[2]
,
Array[2]
,
Array[2]
]
这是一个例子。 http://jsfiddle.net/larsenmtl/Fzwzj/1/(您必须在浏览器中缓存 jqPlot js 文件,因为它们不允许热链接。)
在调用 ajax 之前,您必须实现某种计时器来等待 5 秒左右,因为 postdrawseries 钩子会在每个拖动事件上触发。但这应该不会太难。