d3.js - d3 で複数の要素を移行する

Question

私は D3js でのトランジションにかなりの時間を費やしています。ここにフィドルを投稿しました: dynamic area graph。私が遭遇する問題は、このチュートリアルパスの遷移をたどろうとすると、、xAxis で同期の問題が発生しました。Bostock は、データが横から「ずれて」見えるように、ドメインをわずかに傾ける必要があることを示しています。ただし、そうすると、反映されたデータは、実際に表示されるはずの時間より「2分」遅れて目盛りの下に表示されます。クリップパスでトリッキーなことをせずに、データをそのまま更新すると、うまくいきます。すべてのデータは同期されています。参考までに、xAxis は整数の線形スケールです。d3 は優れた時間操作機能を備えていますが、日付文字列を扱うのは面倒でしたが、エポックを扱う方が簡単だと思います。誰かがフィドルをチェックして、図面全体を移行する方法を教えてくれたら... bostockの例のようにスムーズにしたい.

SO にはコードが必要なので、生成しているデータ構造は次のとおりです。残りはフィドルにあります：

    setInterval(function(){
  lastTime = lastTime.add('m',1);
  var data = {"apikey":"FOO",
    "description":"a dumb description",
    "beg_effective_dt_tm":lastTime,
    "data":{
      "sum":getRandomInt(385,4000),
      }
    };
    tick(data);
},1000)