4

是否有与 jQuery 的 SVG 元素的 slideDown 方法等效的方法？现在这些元素只是突然出现。我想通过向下滑动来软化一点。

编辑：我的代码基于这里的动态堆叠条形图：http: //benjchristensen.com/2011/12/16/dynamic-stacked-bar-chart-using-d3-js/

我没有一个带有许多条的图表，而是有许多带有一条条的图表。我想让它当图表出现时，它会慢慢滑下来。

4

1 回答 1

4

我不相信 jQuery 很容易支持 SVG。Keith Wood 有一个SVG 特定的 jQuery 库，它允许你做一些动画。

另一种选择是使用与 SVG 一起使用的图形库。首先想到的是D3.js，它提供了一些非常易于使用的方法来操作 SVG 元素。此外，选择器样式类似于您可能习惯用于 jQuery 的样式。

如果您使用的是 D3，我会检查转换方法。您可以做很多事情，而 D3 非常强大。一个例子是：

var rect = d3.select('#rectangle');
// this selects a rectangle.  Let's say that it starts at 
// the origin, or even off screen in your case   

rect.transition()
    .duration(250)
    .attr('x', 10)
    .attr('y', 20); 
    // this changes the x and y attributes
    // of the rectangle to 10 and 20 respectively
    // using a transition over a 250ms duration.

对于您给出的特定示例，我只需更改y属性，使其从屏幕开始（例如y = -1 * height），然后将其转换为y = heightory = 200或类似的东西。

于 2012-10-12T17:29:58.460 回答