Function createLineDragHandles

src/components/shapes/draw.js:341–384

()

    }

    function createLineDragHandles() {
        var minSensoryWidth = 10;
        var sensoryWidth = Math.max(shapeOptions.line.width, minSensoryWidth);

        // Helper shapes group
        // Note that by setting the `data-index` attr, it is ensured that
        // the helper group is purged in this modules `draw` function
        var g = shapeLayer.append('g').attr('data-index', index).attr('drag-helper', true);

        // Helper path for moving
        g.append('path').attr('d', shapePath.attr('d')).style({
            cursor: 'move',
            'stroke-width': sensoryWidth,
            'stroke-opacity': '0' // ensure not visible
        });

        // Helper circles for resizing
        var circleStyle = {
            'fill-opacity': '0' // ensure not visible
        };
        var circleRadius = Math.max(sensoryWidth / 2, minSensoryWidth);

        g.append('circle')
            .attr({
                'data-line-point': 'start-point',
                cx: xPixelSized ? x2p(shapeOptions.xanchor) + shapeOptions.x0 : x2p(shapeOptions.x0, shiftXStart),
                cy: yPixelSized ? y2p(shapeOptions.yanchor) - shapeOptions.y0 : y2p(shapeOptions.y0, shiftYStart),
                r: circleRadius
            })
            .style(circleStyle)
            .classed('cursor-grab', true);

        g.append('circle')
            .attr({
                'data-line-point': 'end-point',
                cx: xPixelSized ? x2p(shapeOptions.xanchor) + shapeOptions.x1 : x2p(shapeOptions.x1, shiftXEnd),
                cy: yPixelSized ? y2p(shapeOptions.yanchor) - shapeOptions.y1 : y2p(shapeOptions.y1, shiftYEnd),
                r: circleRadius
            })
            .style(circleStyle)
            .classed('cursor-grab', true);

        return g;
    }

    function updateDragMode(evt) {
        if (shouldSkipEdits(gd)) {