D3.js警告：腳本沒有響應消息

我一段時間後收到錯誤消息，在D3D3.js警告：腳本沒有響應消息

.transition() 
           .duration(250) 
           .delay(0) 
           .each(blink);

function blink() { 

         var line = d3.select(this); 
         (function repeat() { 
         line = line.transition() 
         .style("opacity", function(d) { return(1);}) 
         .transition() 
         .style("opacity", function(d) { return(0);}) 
         .each("end", repeat);})(); 
      }

來源

2016-02-23 De Goya

你的錯誤是什麼？ – thatOneGuy

看到編輯後 –

你在瀏覽器中運行這個嗎？你可以用一堆代碼來設置一個JSFiddle來向我們展示你的問題。當你把.style（「opacity」，function（d）{return（1）; {），你可以把.style（「opacity」，1）。此外，也許在轉換後稍微延遲一段時間，否則您的瀏覽器可能會混亂 – thatOneGuy

使用閃爍功能時，就像我說的在我的評論中：

你已經創建了一個嵌套轉換，每17ms，你一個再創造另一個過渡這反過來又觸發間隔爲17MS ...

爲了解決這個問題，刪除嵌套：

<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <script data-require="[email protected]" data-semver="3.5.3" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <script> 
 
     
 
     var svg = d3.select('body') 
 
     .append('svg') 
 
     .attr('width', 300) 
 
     .attr('height', 300); 
 
     
 
     svg 
 
     .append('line') 
 
     .attr('y1', 150) 
 
     .attr('y2', 150) 
 
     .attr('x1', 0) 
 
     .attr('x2', 300) 
 
     .style('fill', 'none') 
 
     .style('stroke', 'steelblue'); 
 
     
 
     svg.selectAll("line") 
 
     .each(blink); 
 
     
 
     function blink(){ 
 
     var self = d3.select(this); 
 
     self 
 
      .transition() 
 
      .duration(250) 
 
      .style("opacity", function(d) { 
 
      return self.style("opacity") === "1" ? "0" : "1"; 
 
      }) 
 
      .each("end", blink); 
 
     } 
 
     
 
    </script> 
 
    </body> 
 

 
</html>

當然，如果你只是想要的東西眨眼你可以這樣做with straight css：

<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> 
 
    <style> 
 
.blink { 
 
    animation: blink-animation 1s steps(5, start) infinite; 
 
    -webkit-animation: blink-animation 1s steps(5, start) infinite; 
 
} 
 
@keyframes blink-animation { 
 
    to { 
 
    visibility: hidden; 
 
    } 
 
} 
 
@-webkit-keyframes blink-animation { 
 
    to { 
 
    visibility: hidden; 
 
    } 
 
} 
 
    </style> 
 
    
 
    </head> 
 

 
    <body> 
 
    <script> 
 
     
 
     var svg = d3.select('body') 
 
     .append('svg') 
 
     .attr('width', 300) 
 
     .attr('height', 300); 
 
     
 
     svg 
 
     .append('line') 
 
     .attr('class', 'blink') 
 
     .attr('y1', 150) 
 
     .attr('y2', 150) 
 
     .attr('x1', 0) 
 
     .attr('x2', 300) 
 
     .style('fill', 'none') 
 
     .style('stroke', 'steelblue');  
 

 
    </script> 
 
    </body> 
 

 
</html>

來源

2016-02-23 16:36:35 Mark

非常感謝，我希望這會解決我的問題 –

我有這樣的事情 setInterval（vmhvlan，30000）; \t \t \t 功能vmhvlan（）\t {風險SVG = d3.select（ '主體'） .append（ 'SVG'） .attr（ '寬度'，300） .attr（ '身高'，300 ）; SVG .append（ '線'） .attr（ 'Y1'，150） .attr（ 'Y2'，150） .attr（ 'X1'，0） .attr（ '×2'，300 ） .style（'fill'，'none'） .style（'stroke'，'steelblue'）; svg.selectAll（「線」）。每個（眨眼）;} 功能眨眼（）{ .... }會這樣的問題？ –

@DeGoya，你仍然得到一個沒有反應的消息？你爲什麼每30秒重新添加一個新的svg，line等等？ – Mark

D3.js警告：腳本沒有響應消息

回答

相關問題