Lanzamiento de bucle de transición D3 Error de tipo no capturado: t.call no es una función
Muy nuevo para D3 y relativamente nuevo para JS en general. Estoy tratando de crear un círculo al hacer clic, y ese círculo una vez creado debe pulsar repetidamente para siempre. En este momento, se está creando correctamente y realiza la transición una vez, pero luego muere debido al error. Aquí está mi código:
var shapesAtt = shapes
// omitted: assigning fill, position, etc; working as intended
.on("click", circleMouseClick);
function circleMouseClick(d, i)
{
createPulse(this);
}
function createPulse(focusElement)
{
// takes in "focal circle" element
// some things here are hard coded for ease of reading
// (i.e. these variables aren't all useless)
var focus = d3.select(focusElement);
var origR = focus.attr("r");
var origX = focus.attr("cx");
var origY = focus.attr("cy");
var origFill = focus.style("fill");
var strokeColor = "black";
var newG = svgContainer.append("g");
var pulser = newG.append("circle").attr("id", "pulser")
.style("fill", "none").style("stroke", strokeColor)
.attr("cx", 150).attr("cy", 150)
.attr("r", origR)
.transition()
.duration(2000)
.each(pulsate);
}
function pulsate()
{
var pulser = d3.select(this);
pulser = pulser
.transition().duration(2000)
.attr("r", 25)
.attr("stroke-width", 50)
.transition().duration(2000)
.attr("r", 90)
.attr("stroke-width", 10)
.each("end", pulsate);
}
El error que recibo cuando se ejecuta en Chrome es:
Uncaught TypeError: t.call is not a function d3.v4.min.js:4
La parte de mi código con la que creo que está teniendo problemas es:
function pulsate()
{
// ...
.each("end", pulsate);
}