Function renderAnchor

src/components/shapes/draw.js:626–683

()

        }

        function renderAnchor() {
            var isNotPath = shapeOptions.type !== 'path';

            // d3 join with dummy data to satisfy d3 data-binding
            var visualCues = shapeLayer.selectAll('.visual-cue').data([0]);

            // Enter
            var strokeWidth = 1;
            visualCues
                .enter()
                .append('path')
                .attr({
                    fill: '#fff',
                    'fill-rule': 'evenodd',
                    stroke: '#000',
                    'stroke-width': strokeWidth
                })
                .classed('visual-cue', true);

            // Update
            var posX = x2p(
                xPixelSized
                    ? shapeOptions.xanchor
                    : Lib.midRange(
                          isNotPath
                              ? [shapeOptions.x0, shapeOptions.x1]
                              : helpers.extractPathCoords(shapeOptions.path, constants.paramIsX)
                      )
            );
            var posY = y2p(
                yPixelSized
                    ? shapeOptions.yanchor
                    : Lib.midRange(
                          isNotPath
                              ? [shapeOptions.y0, shapeOptions.y1]
                              : helpers.extractPathCoords(shapeOptions.path, constants.paramIsY)
                      )
            );

            posX = helpers.roundPositionForSharpStrokeRendering(posX, strokeWidth);
            posY = helpers.roundPositionForSharpStrokeRendering(posY, strokeWidth);

            if (xPixelSized && yPixelSized) {
                var crossPath =
                    'M' +
                    (posX - 1 - strokeWidth) +
                    ',' +
                    (posY - 1 - strokeWidth) +
                    'h-8v2h8 v8h2v-8 h8v-2h-8 v-8h-2 Z';
                visualCues.attr('d', crossPath);
            } else if (xPixelSized) {
                var vBarPath = 'M' + (posX - 1 - strokeWidth) + ',' + (posY - 9 - strokeWidth) + 'v18 h2 v-18 Z';
                visualCues.attr('d', vBarPath);
            } else {
                var hBarPath = 'M' + (posX - 9 - strokeWidth) + ',' + (posY - 1 - strokeWidth) + 'h18 v2 h-18 Z';
                visualCues.attr('d', hBarPath);
            }
        }