Ich habe einen Pfad in d3.js definiert, es zeichnet korrekt, aber .getTotalLength() ist nicht definiert

Question

Der folgende Code generiert einen Pfad aus Daten.

var path = gameBoard.append('path') 
    .attr("id", "snake" + snakeIndex) 
    .attr("d", interpolator(data)) 
    .attr('stroke-width', snakeStroke) 
    .attr('fill', 'none') 
    .attr('stroke', config.snakeColor); 

Der kurvige Pfad, der von den Daten definiert wird, wird korrekt gezeichnet.

schlägt hier getTotalLength() nicht definiert ist:

var totalLength = path.getTotalLength(); 

Zusätzlich getPointAlongLength() nicht definiert ist entweder:

var point = path.getPointAtLength(position); 

Answer 1

Statt:

var totalLength = path.getTotalLength(); 

Es muss sein :

var totalLength = path.node().getTotalLength(); 

getTotalLength() funktioniert auf dem Knoten, aber path ist ein Array von Knoten, nicht der Knoten selbst. Sie müssen also path.node() oder path[0][0] verwenden.

Answer 2

Ja, ich entdeckte, dass ich path.node() verwenden musste, um das richtige Objekt zu erhalten. Die d3.js Dokumentation ist extrem schwer zu lesen, mit wenigen Beispielen.