2017-08-31 24 views
-1

我重構一個圖表應用程序,從V3到V4d3.js V3到V4的錯誤 - 動畫和textcontext

  1. 「類型錯誤:callback.call是不是一個函數」

這裏是代碼 - 但我不知道爲什麼這會導致callback.call錯誤?

waveGroup.attr('transform','translate('+waveGroupXPosition+','+waveRiseScale(0)+')') 

enter image description here


我相信它的這個animateWave代碼

  // Data for building the clip wave area. 
      var data = []; 
      for(var i = 0; i <= 40*waveClipCount; i++){ 
       data.push({x: i/(40*waveClipCount), y: (i/(40))}); 
      } 
var clipArea = d3.area() 

     var wave = waveGroup.append("path") 
      .datum(data) 
      .attr("d", clipArea) 
      .attr("T", 0); 


     function animateWave() { 
      wave.attr('transform','translate('+waveAnimateScale(wave.attr('T'))+',0)'); 

      wave.transition() 
       .duration(config.waveAnimateTime * (1-wave.attr('T'))) 
       .ease('linear') 
       .attr('transform','translate('+waveAnimateScale(1)+',0)') 
       .attr('T', 1) 
       .each('end', function(){ 
        wave.attr('T', 0); 
        animateWave(config.waveAnimateTime); 
       }); 
     } 

一個問題,我想我需要重構它 - 所以它更像是這

function repeat() { 
    timeCircle 
    .attr('cx', 210)   // position the circle at 40 on the x axis 
    .attr('cy', (yPos*45)+25) // position the circle at 250 on the y axis 
    .transition()    // apply a transition 
    .ease(easement)   // control the speed of the transition 
    .duration(4000)   // apply it over 2000 milliseconds 
    .attr('cx', 720)   // move the circle to 920 on the x axis 
    .transition()    // apply a transition 
    .ease(easement)   // control the speed of the transition 
    .duration(4000)   // apply it over 2000 milliseconds 
    .attr('cx', 210)   // return the circle to 40 on the x axis 
    .on("end", repeat);  // when the transition finishes start again 
}; 

https://bl.ocks.org/d3noob/1ea51d03775b9650e8dfd03474e202fe 寬鬆功能已經改變?

回答

-2

我沒有看到這行代碼有什麼問題,但我想知道錯誤是否與waveGroup的值有關。在d3中,有時很容易混淆哪些方法返回選擇,哪些不選擇。我的猜測是waveGroup沒有引用在運行時的選擇。