D3.js: Не начинать новый переход, пока не завершится предыдущий?

Question 1

Я использую график D3 вместе с картой Google. Я хочу, чтобы график переходил каждый раз при изменении масштаба карты. Он отлично работает, если масштаб не меняется быстрее, чем завершилось обновление перехода. Однако двойное нажатие кнопки масштабирования приводит к прерыванию переходов.

Как я могу остановить следующий переход до того, как закончится предыдущий?

Это мой код (это приложение Backbone):

    render: function() { 
      this.renderMap();
    },
    renderMap: function() {
      var that = this; 
      ...
      google.maps.event.addListener(that.mapControl, 'zoom_changed', function() {
        that.change();
      });
    },
    change: function() {
      var that = this;
      d3.transition().duration(750).each(function() {
        that.redraw();
      });
    },
    redraw: function() {
      ...
      this.redraw = function() {
        ...
        var barUpdate = d3.transition(bar).attr("transform", function(d) {
            return "translate(0," + (d.y0 = y(d.State)) + ")";
        }).style("fill-opacity", 1);
      };
    }

javascript d3.js

3

Richard 10 Апр 2013 в 18:58

Answer

Глядя на ваш код, я думаю, что вы могли бы разделить свои переходы, добавив задержку на основе индекса.

.transition()
  .duration(750)
  .delay(function(d, i){
        return i * 750
  })

Если вы ищете точный момент окончания перехода, вы можете попробовать добавить .each ("end", listener) к transition (), которое вызовет слушателя в конце перехода. Transitions # Control. Сделать код похожим на этот?

.transition()
    .duration(750)
    .each("end", that.redraw())

Надеюсь это поможет.

4

chrtan 10 Апр 2013 в 19:22

Мне нравится эта идея. У меня есть около 20 событий, которые мне нужно запустить, когда «курсор» перемещается по графику. Я попробую и проверю.

–

David Mann

20 Май 2014 в 01:17

2

Всем следует помнить об этом важном примечании из документации:

Note that if the transition is superseded by a later-scheduled transition on a given element, no end event will be dispatched for that element; interrupted transitions do not trigger end events.

–

jlewkovich

14 Ноя 2014 в 06:39

Question 2