將文本元素與圓弧一起移動RaphaelJS

Question

我正在使用以下代碼來繪製（和設置動畫）帶RaphaelJS的圓弧路徑;

self.paper = Raphael(domElement, width, height); 

    self.paper.customAttributes.arc = function (xloc, yloc, value, total, R) { 
     var alpha = 360/total * value, 
      a = (90 - alpha) * Math.PI/180, 
      x = xloc + R * Math.cos(a), 
      y = yloc - R * Math.sin(a), 
      path; 
     if (total == value) { 
      path = [ 
       ["M", xloc, yloc - R], 
       ["A", R, R, 0, 1, 1, xloc - 0.01, yloc - R] 
      ]; 
     } 
     else { 
      path = [ 
       ["M", xloc, yloc - R], 
       ["A", R, R, 0, +(alpha > 180), 1, x, y] 
      ]; 
     } 
     return { path: path }; 
    }; 

    self.arc = self.paper.path().attr({ 
     'fill':    'none', 
     'stroke':   self.color, 
     'stroke-opacity': 1, 
     'stroke-width':  self.barWidth, 
     'arc':    [self.centerX, self.centerY, 0, 100, position] 
    }; 

    self.arc.animate({ 
     'arc': [self.centerX, self.centerY, domein.kennis, 100, position] 
    }, self.duration, 'backOut'); 

現在文本標籤需要隨着弧線一起移動。我在解決如何沿弧的路徑移動文本元素時遇到問題。任何幫助，將不勝感激。

編輯：問題是正確定位文本元素;

see this question/jsfiddle

Answer 1

使用拉斐爾的animateWith()對文本元素的動畫與圓弧的動畫鏈接。