Draggind数据点和提交值 [英] Draggind data points and submitting values
问题描述
在 jqPlot 页面上,有一个将数据点拖放到
On page jqPlot there is an example of dragging data point on jqPlot chart.
如何提交(例如使用jQuery ajax)服务器更改的值?更改的(当前的)值存储在jqplot对象的某处?
How can I submit (e.g. with jQuery ajax) to server changed values? Are changed (current) values stored somewhere in jqplot object?
推荐答案
这里最难的是知道用户拖动点,后来没有得到数据。我建议你使用一个postDrawSeries钩子,像这样:
The hardest thing here is knowing when the user drags a point, not getting the data afterward. I recommend you use a postDrawSeries hook like so:
$(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
}
});
每次拖动时的输出为(包含更新的数据点):
Output on every drag is (containing the updated data point):
[
Array[2]
,
Array[2]
,
Array[2]
,
Array[2]
]
这里有一个例子。(你必须在浏览器中缓存jqPlot js文件,因为它们不是允许热链接。)
Here's an example. (You'll have to cache the jqPlot js files in your browser since they do not allow hotlinking.)
在每次拖拽事件后,postdrawseries钩子触发后,你必须实现某种定时器等待5秒左右才能调用你的ajax。这不应该太难了。
You'll have to implement some sort of timer to wait for 5 seconds or so before calling your ajax since the postdrawseries hook fires on EVERY drag event. That shouldn't be too hard though.
这篇关于Draggind数据点和提交值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!