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

jqPlot with constrainTo - get dragged point value

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

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

现在,我想要被拖动的点的新值以及系列,以便我知道要更新哪个系列。我发现很少有问题与我的需求相关。

  1. [jqplot]Get the point index when dragged

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

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

  2. 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 个数据点。

  3. Draggind data points and submitting values

    这再次总结了以上两个,但有一个额外的选项postDrawSeries

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

  1. 拖动点值
  2. 拖拽系列详情。

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

您可以在此处查看 fiddle

不幸的是,我找不到任何官方文档来支持我的答案,但是通过查看 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-axis' 值。

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