带有constrainTo的jqPlot - 获取拖动点值

Posted 2023-05-08

【中文标题】带有constrainTo的jqPlot - 获取拖动点值

【英文标题】：jqPlot with constrainTo - get dragged point value

【发布时间】：2016-04-04 05:33:58

【问题描述】：

我使用dragable 选项，使用constrainTo 限制拖动到单个轴，同时在所有系列上绘制图表。

series: [
    dragable: 
        constrainTo: 'y',
    
, 
    dragable: 
        constrainTo: 'y',
    
,
....
]

现在，我想要被拖动的点的新值和系列，以便我知道要更新哪个系列。我发现了一些与我的需求相关的问题。

[jqplot]Get the point index when dragged

$('#chart1').bind('jqplotDataClick',function(ev, seriesIndex, pointIndex, data) );

虽然问题是关于拖动，但给出的答案是针对使用 jqplotDataClick 的 click 事件，这在我的情况下不起作用

Jqplot - How do get array back from already created graph

$('#chart1').bind('jqplotDragStop',function(ev, seriesIndex, pointIndex, data) 
    console.log(chart.series[0].data);
);

这是关于在拖动后获取整个系列数据。当您只有一个系列和有限的数据集时，这可能会很好。就我而言，我正在处理多个系列，每个系列包含近 100 个数据点。

Draggind data points and submitting values

这再次总结了上述两个，但有一个额外的选项postDrawSeries。

那么，有什么办法可以得到

拖动点值 拖动系列详情。

注意：使用constrainTo时，回调函数中的pointIndex给出了鼠标的位置，但拖动点的详细信息。前任。假设我拖动(2, 100)，而我的鼠标毒药是(10, 200)。当我在y-axis 上使用constrainTo 时，实际点值是(2, 200) 但我在pointIndex 中得到的是鼠标位置，即(10, 200)。

你可以在这里查看fiddle

【参考方案1】：

不幸的是，我找不到任何官方文档来支持我的答案，但是从查看 Draggable source 来看，似乎有一个 jqplotDragStart 事件，其参数为 seriesIndex（包含拖动点）和pointIndex（系列中拖动点的索引）。

我已经实现了这个事件处理程序，在开始拖动时将这些参数分配给 javascript 变量：

var draggedPointValue;
var draggedSeriesValue;

...

$('#chart1').bind('jqplotDragStart',function(ev, seriesIndex, pointIndex, data)    
    console.log('started dragging point ' + pointIndex);
    console.log('started dragging series ' + seriesIndex);
    draggedPointValue = pointIndex;   
    draggedSeriesValue = seriesIndex;   
);

然后您的jqplotDragStop 函数可以访问它们：

$('#chart1').bind('jqplotDragStop',function(ev, seriesIndex, pointIndex, data) 
    console.log(draggedPointValue);
    console.log(draggedSeriesValue);
    console.log(pointIndex);
    //console.log(plot1.series);
);

您仍然需要从jqplotDragStop 函数的pointIndex 参数的yaxis 属性中获取新的“y 轴”值。

我创建了一个Fiddle 来演示这一点。