D3.js: लगातार एक संक्रमण चलाते हैं?

Question

मैं D3.js में लगातार एक संक्रमण कैसे चला सकता हूं?

उदाहरण के लिए, मैं कहता हूं कि मैं body रंग लाल से नीले रंग में बदलना चाहता हूं और फिर से, लगातार (मुझे नहीं, यह भयानक होगा, लेकिन इसके साथ जाना होगा)।

यह कैसे मैं इसे एक बार करना होगा है:

d3.select("body").transition().duration(1000).style("background-color", "red"); 

मैं इसे कैसे लगातार करना होगा?

मैंने देखा है निकटतम उदाहरण d3.timer का उपयोग करते हैं, लेकिन मुझे यकीन नहीं है कि ऐसा करने का एक बेहतर तरीका है या नहीं।

Answer 1

आप transition.each() और "अंत" ईवेंट का उपयोग कर सकते हैं। कोड निम्न की तरह कुछ दिखता है।

function myTrans() { 
    d3.select("body").transition().duration(1000).style("background-color", "red") 
     .each("end", function() { 
     d3.select(this).transition().duration(1000).style("background-color", "blue") 
      .each("end", function() { myTrans(); }); 
     }); 
} 

Answer 2

आप इस ब्लॉग पोस्ट (2 भागों) डी 3 संक्रमण पर बाहर की जाँच करने के लिए चाहते हो सकता है - http://blog.safaribooksonline.com/2013/07/11/reusable-d3-js-using-attrtween-transitions-and-mv/

मैं सिर्फ डी 3 के साथ काम करने की शुरुआत कर रहा हूँ और यह मददगार था।

Answer 3

आप डी 3 संस्करण 4 के लिए चाहते प्रत्येक (लार्स उत्तर के आधार पर) के बजाय .on उपयोग करने के लिए:

function myTrans() { 
    d3.select("body").transition().duration(1000).style("background-color", "red") 
     .on("end", function() { 
     d3.select(this).transition().duration(1000).style("background-color", "blue") 
      .on("end", function() { myTrans(); }); 
     }); 
}