Snapsvg - 相對於其當前位置旋轉

Question

我在拖動元素後無法獲得相對於其位置的旋轉元素。

我有一個滑塊，從0-360去當值改變以下稱爲：

var origTransform = activeElement.transform().local 
if(origTransform) { 
    var rSplit = origTransform.split('r'); 
    if(rSplit.length !== 0) { 
     origTransform = rSplit[0] + "r" + degrease + ",20,20" 
    } 
} else { 
    origTransform = "r" + degrease + ",20,20" 
} 
activeElement.attr({ 
    transform: origTransform 
}); 

任何人看到我去錯了嗎？

千恩萬謝

Answer 1

感謝@ian爲我安排有：

http://jsfiddle.net/4eL3gstp/17/

(function(){ 
    var canvas = Snap('#svg'); 
    var text = null; 
    var setRotation = function(degrease){ 

     var data = text.data('origionalData'); 
     var matrix = new Snap.Matrix(1,0,0,1,data.dx,data.dy); 
     matrix.rotate(degrease,0,0); 

     text.attr({ 
      transform: matrix, 
     }); 

    }; 
    canvas.attr({ width : 200, height : 200 }); 
    text = canvas.text(100,100, 'texttext').attr({ 
     'text-anchor' : 'middle', 
     'font-size' : 50, 
     transform: 't50,50' 
    }); 

    text.drag(); 
    text.data('origionalData', text.transform().localMatrix.split()); 
    text.attr({ 
     transform : 't' + text.data('origionalData').dx + ',' + text.data('origionalData').dy, 
     x : 0, 
     y : 0 
    }); 

    eve.on("snap.drag.end", function() { 
     text.data('origionalData', text.transform().localMatrix.split()); 
    });  

    var interval = null; 
    $('#textRotate').bind('mousedown', function(){ 
     var slider = $(this); 
     interval = setInterval(function(){ 
      setRotation(slider.val()); 
     }, 50); 
    }).bind('mouseup.builder', function(){ 

     clearInterval(interval); 
    }) 
    .bind('change', function(){ 
     setRotation($(this).val()); 
    }); 
})();