Sehr neu in D3 und relativ neu in JS im Allgemeinen. Ich versuche, beim Klicken einen Kreis zu erstellen, und dieser einmal erstellte Kreis muss immer wieder für immer pulsieren. Im Moment wird es richtig erstellt und führt den Übergang einmal durch, aber dann stirbt es aufgrund des Fehlers ab. Hier ist mein Code:

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);
}

Der Fehler, den ich beim Ausführen in Chrome erhalte, lautet:

Uncaught TypeError: t.call is not a function     d3.v4.min.js:4

Der Teil meines Codes, mit dem ich glaube, dass er Probleme hat, lautet:

function pulsate()
{
    // ...   
    .each("end", pulsate);
}