Jestem nowy w javascript i d3js. Chciałbym obiekt DOM do śledzenia ścieżki określonej przez sparametryzowaną krzywą (x (t), y (t)). Oto przykład takiej parametryzacji:

var theta = [];
        for(var i = 0; i <= N; i++){
        theta.push(2*Math.PI*i/N);
    }
var points = [];
    for(var i = 0; i <= N; i++){
        points.push([Math.cos(theta[i]),Math.sin(theta[i])]);
    }

Powyższe jest parametryzacją krzywej - w tym przypadku także okręgu - i chciałbym, aby mój obiekt DOM podążał za trajektorią tej krzywej. [Na bok: czy jest lepszy sposób na zdefiniowaniepoints? Wydaje się śmieszne, aby uruchomić pętlę for.]

Prymitywnym sposobem na uzyskanie efektu, którego szukam, jest uruchomienie pętli for w części update () w d3. Po pierwsze, po prostu dołączam okrąg do zmiennej svg, aby nie musiał być powiązany z żadnymi danymi. Jest on następnie wybierany i aktualizowany bez wymaganego wejścia / wyjścia.

        for (var i = 0; i <= N; i++){
        svg.selectAll("circle")
                .transition()
                .attr("cx",points[i][0]+w/2) // w: width
                .attr("cy",points[i][1]+h/2) // h: height
                .duration(dt) // 
                .delay(dt*i);
            }

[Na bok: Słyszałem, że kolejka () byłaby lepsza, w przeciwieństwie do obliczania całkowitego opóźnienia. Komentarze?] Jednak właściwość łagodzenia przejścia powoduje, że działa on w sposób niepewny. Wyobrażam sobie, że mógłbym określić brak luzowania, ale jestem pewien, że musi istnieć lepszy sposób na osiągnięcie tego, czego chcę, czyli po prostu, aby początkowy obiekt DOM (okrąg) poruszał się płynnie wzdłuż określonej trajektorii.

W końcu chciałbym to zrobić dla wielu obiektów DOM, które ostatecznie zostaną połączone z danymi, z których każda ma określoną krzywą do naśladowania. Jakieś wskazówki, jak bym to zrobił?

Z góry dziękuję za wszelką pomoc i chętnie skorzystam z wszelkich porad, w tym referencji.