限制高图可拖动点

Restrict Highchart draggable points

本文关键字：拖动 高图可      更新时间：2023-09-26

已经实现了highchart的可拖拽插件，但是我有一个特定的要求，其中允许用户拖放新添加的点

 var x = e.xAxis[0].value,
 y = e.yAxis[0].value,
 series = this.series[seriesType];
 //tried this to set only this point as draggable
 series.draggableX  = true;
 series.draggableY  = true ;
 series.addPoint([x, y]);

我可以设置draggableX,draggableY为真只有这一点吗?

我将这个参数添加到代码中，但是您需要编辑源代码。

function mouseDown(e) {
        var options,
            originalEvent = e.originalEvent || e,
            pointDraggableX,
            pointDraggableY,
            hoverPoint,
            series;
        if ((originalEvent.target.getAttribute('class') || '').indexOf('highcharts-handle') !== -1) {
            hoverPoint = originalEvent.target.point;
        }

        series = chart.hoverPoint && chart.hoverPoint.series;
        if (!hoverPoint && chart.hoverPoint && (!series.useDragHandle || !series.useDragHandle())) {
            hoverPoint = chart.hoverPoint;
        }
        if (hoverPoint) {
            options = hoverPoint.series.options;

            pointDraggableX = hoverPoint.draggableX !== UNDEFINED ? hoverPoint.draggableX : options.draggableX;
            pointDraggableY = hoverPoint.draggableY !== UNDEFINED ? hoverPoint.draggableY : options.draggableY;

            if (options.draggableX && pointDraggableX) {
                dragPoint = hoverPoint;
                dragX = originalEvent.changedTouches ? originalEvent.changedTouches[0].pageX : e.pageX;
                dragPlotX = dragPoint.plotX;
            }
            if (options.draggableY && pointDraggableY) {
                dragPoint = hoverPoint;
                dragY = originalEvent.changedTouches ? originalEvent.changedTouches[0].pageY : e.pageY;
                dragPlotY = dragPoint.plotY + (chart.plotHeight - (dragPoint.yBottom || chart.plotHeight));
            }
            // Disable zooming when dragging
            if (dragPoint) {
                chart.mouseIsDown = false;
            }
        }
    }

示例:http://jsfiddle.net/AyUbx/2607/

相关文章：