将文本元素与弧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

使用Raphaël的animateWith()将文本元素动画与圆弧动画链接起来。