d3.js Globe animation causing errors in Chrome

Question

My d3 globe is working as desired - rotating and with pulsing circles on a list of locations. However in Chrome the following error occurs:

Error: attribute d: Expected moveto path command ('M' or 'm'), "null".

I believe this is related to the interpolation with attrTween going to null, but I am not knowledgeable enough to understand why / when this occurs or how to fix it.

Relevant code:

                for (var i = 0; i < locale.length; i++) {
                    center = locale[i];
                    var circ = g.append("path")
                        .datum({endAngle: 0})
                        .attr("class", "ripple location" + (i+1))
                        .attr("fill", "#000")
                        .attr("fill-opacity", 0.2)
                        .attr("opacity", 1)
                        .attr("d", d => path(geoCircle.center(center).radius(2)()))
                        .transition()
                        .delay(0)
                        .duration(3500)
                        .ease(d3.easeLinear)
                        .attr("opacity", 0)
                        .attrTween("d", geoCircleTween(12, center))
                        .remove();

                    function geoCircleTween(newAngle, loca) {
                        return function(d) {
                            var interpolate = d3.interpolate(d.endAngle, newAngle);
                            return function(t) {
                                d.endAngle = interpolate(t);
                                return path(geoCircle.center(loca).radius(d.endAngle)());
                            };
                        };
                    } 
                }
                requestAnimationFrame(animate);
            }
            requestAnimationFrame(animate);

and a full working demo version visible here: https://mikechalmers.co.uk/globe2/