美文网首页
d3-transition

d3-transition

作者: justnomomo | 来源:发表于2020-02-17 15:56 被阅读0次

    Transition生命周期

    Immediately after creating a transition, such as by selection.transition or transition.transition, you may configure the transition using methods such as transition.delay, transition.duration, transition.attr and transition.style. Methods that specify target values (such as transition.attr) are evaluated synchronously; however, methods that require the starting value for interpolation, such as transition.attrTween and transition.styleTween, must be deferred until the transition starts.
    使用selection.transition或transition.transition创建一个transition之后,紧跟着可以配置transition.delay, transition.duration, transition.attr和transition.style。指定目标值的方法,如transition.attr和transition.style会被同步调用;然而,需要起始值做插值的方法,如transition.attrTween和transition.styleTween,会被推迟到transition start后。

    Shortly after creation, either at the end of the current frame or during the next frame, the transition is scheduled. At this point, the delay and start event listeners may no longer be changed.
    transition创建后不久,在当前帧结束或下一帧期间,transition is scheduled。此时,delay和start事件可能不再被改变。

    When the transition subsequently starts, it interrupts the active transition of the same name on the same element, if any, dispatching an interrupt event to registered listeners. (Note that interrupts happen on start, not creation, and thus even a zero-delay transition will not immediately interrupt the active transition: the old transition is given a final frame. Use selection.interrupt to interrupt immediately.) The starting transition also cancels any pending transitions of the same name on the same element that were created before the starting transition. The transition then dispatches a start event to registered listeners. This is the last moment at which the transition may be modified: after starting, the transition’s timing, tweens, and listeners may no longer be changed. The transition initializes its tweens immediately after starting.
    transition start,随后,它interrupt同元素上同名的active transition(如果有的话),向注册的listeners分派一个interrupt事件。(注意,interrupt在start时发生,而不是creation,因此即使一个无延迟的transition不会立即interrupt当前的active transition: old transition is given a final frame。使用selection.interrupt立即interrupt。)在开始starting transition之前也会取消同元素上同名的任何等候的transition。然后,transition向注册的listeners分派一个start事件。这是可以修改transition的最后时刻:当starting后,transition的timing,tweens和listeners可能不再被改变。transition在starting后立即初始化tweens。

    During the frame the transition starts, but after all transitions starting this frame have been started, the transition invokes its tweens for the first time. Batching tween initialization, which typically involves reading from the DOM, improves performance by avoiding interleaved DOM reads and writes.
    在transition starts期间,在所有transition starting之后,transition将第一次调用tweens。批处理执行tween初始化(通常涉及从DOM读取),通过避免交叉DOM读写操作来提高性能。

    For each frame that a transition is active, it invokes its tweens with an eased t-value ranging from 0 to 1. Within each frame, the transition invokes its tweens in the order they were registered.
    transition是active的每个frame,调用它的tween方法,使用从0到1d的eased t值。在每个frame中,transition按照注册时的顺序调用tweens。

    When a transition ends, it invokes its tweens a final time with a (non-eased) t-value of 1. It then dispatches an end
    event to registered listeners. This is the last moment at which the transition may be inspected: after ending, the transition is deleted from the element, and its configuration is destroyed. (A transition’s configuration is also destroyed on interrupt or cancel.)
    当transition结束时,它最后一次调用tweens,使用1作为t值(non-eased)。然后向注册的listeners分派一个end事件。这是transition可以被inspected的最后一刻:ending之后,transition在元素中被删掉,并且销毁其配置(transition的配置在interrupt或cancel时也会被销毁)。

    相关文章

      网友评论

          本文标题:d3-transition

          本文链接:https://www.haomeiwen.com/subject/pcyvpttx.html