Pfad innerhalb des G-Elements auswählen und Stil ändern

Im Wesentlichen versuche ich, alle Pfade mit Ausnahme des Pfads, über dem sich der Mauszeiger befindet, grau zu machen, während der ausgewählte Pfad seine ursprüngliche Farbe beibehält. Ich konnte alle anderen Pfade grau anzeigen, habe jedoch Probleme mit der Funktion "select.this" und greife tatsächlich auf den Pfad zu, dessen Stil ich ändern möchte. Es scheint, dass ich es tatsächlich geschafft habe, auf das Pfadelement innerhalb der Gruppe g zuzugreifen, aber ich bin mit einem Fehler in der Konsolenaussage konfrontiert

Uncaught TypeError: Property 'style' of object #<SVGGElement> is not a function

Relevanter Code:

    svg.selectAll("g.team")
    .on("mouseover",function(){
            console.log("I see you!");
            var lineName;
            var accuracy = 10;

            svg.selectAll("path.team.line").style("stroke","#C0C0C0"); 
            //set all to gray

            var selectedArray = d3.select(this);
            console.log(selectedArray);

            var selectGroup = selectedArray[0];
            console.log("should be group:"+selectGroup);

            var selectedLine = selectGroup[0];;

            selectedLine.style("color",function(d){  //let active keep color
            lineName = abbrDict[d.name];  //full name to be at end of line
            return color(d.name);
        });

            //get position of end of line
        var len = d3.select(this).children().node().getTotalLength();
        var pos = d3.select(this).node().getPointAtLength(len);  
        //append text to end of line
        svg.append("text")
            .attr("id","tooltip")
            .attr("x",pos.x-55)
            .attr("y",pos.y)
            .text(lineName)
            .style("font-family","sans-serif")
            .style("font-size",13);

            this.parentNode.parentNode.appendChild(this.parentNode); 
            //brings team to front, must select the path's g parent 
            //to reorder it 

    })
    .on("mouseout",function(){
            d3.select("#tooltip").remove();

            d3.selectAll("team").selectAll("path")
              .transition()
              .style("stroke",function(d){
                  return color(d.name);  //return all the colors
               });

            d3.selectAll("axis").selectAll("line").style("color","black");

    });

Bitte und Dankeschön!

Antworten auf die Frage(1)

Ihre Antwort auf die Frage