score:1

Accepted answer

To make the links "blink" you'll want to use a transition. Honestly there's nothing wrong with setInterval, in fact I'd probably use it for ease.

Firstly you want the animation. It'd difficult to know what you mean by "blink" so I'm going to assume gets brighter for now - but you can change this up however you wish.

d3.select("svg")
  .selectAll(".link")
  .transition()
  .duration(500) // miliseconds
  .style("stroke", "white"); 

This will gradually change the style to white over a period of 500ms. Now you need to revert the color back to the original. You can do this using the end event on the transition object.

.on("end", function() {
   d3.select(this).style("stroke", "#CCC");
});

Note that in the above this is the HTMLElement that the transition was running on. You can do this with a lambda (arrow function) if need be but you need to do (d, i, elements) => d3.select(elements[i]);

Now you've got you're transition, which resets. But you want to call it regularly. Honestly, the easiest way to do this is using setInterval... So your final code would look like:

// Create the regular interval
setInterval(() => {
    d3.select("svg")
      .selectAll(".link")
      .transition()
      .duration(500) // miliseconds
      .style("stroke", "white")
      .on("end", function() {
          d3.select(this).style("stroke", "#CCC");
      });

}, 1000);

Related Query

More Query from same tag