Snap Drag and Scale

var s = Snap("#svgout");
var dragging = 0;
var handleGroup;

function addHandleFunc() {
        if( dragging == 0 ) {
                dragging = 1;
                var bb = this.getBBox();
                var handle = new Array();
                handle[0] = s.circle(bb.x,bb.y,10).attr({class: 'handler'});;
                handle[1] = s.circle(bb.x+bb.width, bb.y, 10).attr({class: 'handler'});
                handleGroup = s.group(this, handle[0], handle[1]);
                handleGroup.drag(move,start,stop);
        } else {
                dragging = 0;
                s.append(this);
                handleGroup.selectAll('handler').remove();
                handleGroup.remove();
        }
}

var start = function() {
        this.data('origTransform', this.transform().local);
}

var move = function(dx,dy) {
        var scale = 1 + dx / 50;
        this.attr({
                transform: this.data('origTransform') + (this.data('origTransform') ? "S" : "s") + scale
        });
}

var stop = function() {};


var myRect = s.rect( 100,100,100,100 ).attr({fill: 'blue'});

myRect.dblclick( addHandleFunc );;

s.text(70,220, 'double click the rect');

   


        Edit/Run