Accepted answer

If by "continuously" you mean that you want to run the transition infinitely, use on("end") to call the transition function again.

Here is an example:

var toggle;

var data = [0, 1];


function transition() {
    toggle ^= 1;"circle")
        .style("opacity", data[toggle])
        .on("end", transition);
<script src=""></script>
	<circle cx="100" cy="100" r="50"></circle>


I assume by continuously you mean smoothly transition rather than switch immediately from one opacity state to the next, as opposed to repeating the transition.

You first need to set an initial opacity on the circles when you create them:

.attr("opacity", 0)

And then use d3.selectAll rather than, or better your variable circles


  .delay(function(d,i){ return i*1000; })
  .attr("opacity",function(d){ return d[0] });

More Query from same tag