我想画一张D3饼图。最初将隐藏弧段，然后我想逐个地逐个动画它们以使它们可见以响应来自应用程序流的键盘/鼠标事件。
申请流程是线性的：例如第1部分，为第一个弧段设置动画以使其可见。第2部分，动画第二段以使其可见。第3部分等，直到馅饼完全可见。
我对使用Swiper项目感兴趣 - http://www.idangero.us/swiper/api/#.VqemYVOLQmI - 所以移动到每个幻灯片会触发一个可以使弧可见的事件（即onSlideChangeEnd将显示每个连续弧）
我可以采用的一种方法是将饼段绘制为最初不可见，然后使用样式转换使其可见：
d3.selectAll(“.segment1”).transition().duration(500).style("fill", "#7FB9E6”);
这可以使每个连续弧响应每个事件而可见。
然而，这并不是我想要的外观 - 我希望电弧填充上的动画看起来像是从左向右移动，例如在这种“扫描”动画中：http://jsfiddle.net/thmain/xL48ru9k/1/
如果我没有使用D3更新数据，这种动画是否可以使用（即图表已经创建，我只是希望弧顺序出现以响应事件）。
我是动画/补间的新手，所以感谢您的帮助。谢谢。
答案 0 :(得分：0)
一个想法是初始化图表，所有值最初设置为零。然后，当您的用户浏览您的内容时，只需根据需要更新每个元素＆＃39;各自的数据值。
我认为（我还没有尝试过）它会创造一个“碰撞”。效果，每次用户滑动（或任何函数调用），图表的切片将添加＆＃39;切片并调整可见切片的大小。显示的部分数据（如果有意义的话）。
答案 1 :(得分：0)
最简单的方法可能是直接利用d3.svg.arc形状（饼图只是一个＆＃34;帮助＆＃34;用于创建其中的许多形状）。如果你知道数据的总和，你可以单独计算每个弧的角度，并随意显示/隐藏/动画它们。