带有constrainTo的jqPlot - 得到拖动的点值

时间:2015-12-30 09:02:07

标签: javascript angularjs draggable jqplot

我使用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) {});
    

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

  2. Jqplot - How do get array back from already created graph

    jqplotDataClick

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

  3. Draggind data points and submitting values

    这再次总结了上述两个,但有一个额外的选项$('#chart1').bind('jqplotDragStop',function(ev, seriesIndex, pointIndex, data) { console.log(chart.series[0].data); });

  4. 那么,我有什么方法可以获得

    1. 拖动点值
    2. 拖动系列详情。
    3. 注意:使用postDrawSeries时,回调函数中的constrainTo会给出鼠标的功能,但会显示拖动的详细信息。防爆。假设我拖动pointIndex并且我的鼠标是,(2, 100)。当我在(10, 200)上使用constrainTo时,实际的点值为y-axis,但我在(2, 200)中获得的是鼠标位置,即pointIndex。< / p>

      您可以查看fiddle此处

1 个答案:

答案 0 :(得分:3)

很遗憾,我无法找到任何官方文档来备份我的答案,但是通过查看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);
});

你仍然需要获得新的&#39; y轴&#39;来自yaxis函数的pointIndex参数的jqplotDragStop属性的值。

我已经创建了Fiddle来证明这一点。