2

我正在使用这个 SVG 插件。

这是我的代码：

$(function() {
    $('#svgbasics').svg({onLoad: drawInitial});
});

function drawInitial(svg) {

    var mycircle = svg.circle(75, 75, '50', {fill: '#f2477b', stroke: 'none', 'stroke-width': 0, class_:'drag'});

    $('.drag').click(function() {
       $(this).animate({svgR: '0'},300, function() { $('.drag').css("display", "none"); });
    }

    $("#restore").click(function() {
       $('.drag').css("display", "block");
       $(this).animate({svgR: '50'},300, function() { });
    }
}

通常，有一个（半径）R = 50 的圆圈，当我单击圆圈时，它会动画到 R = 0，然后消失 css（“display”，“none”）。然后，当我单击#restore 元素时，它再次出现，其半径 = 50。我想要实现的是从mycircle变量中获取这个 '50' 值，例如：svgR: $(this.R)

如何从mycircle变量中获取此值？

4

1 回答 1

5

我只能在 Firefox 上对此进行测试，但在该浏览器中mycircle.r返回一个SVGAnimatedLength 实例，其animVal属性返回一个SVGLength实例，而该实例又暴露了一个value属性：

var radius = mycircle.r.animVal.value;

You can test it in this fiddle.

Note that using animVal rather than baseVal allows to get the current value of the circle's radius if it is being animated.

于 2012-10-13T10:30:05.597 回答