Syntax For Axis Transition In Svg/d3

I've an incredibly basic syntax question. I've been learning d3, SVG, and Javascript mostly by editing someone else's code, which is challenging. The goal is to update a y axis aft

Solution 1:

Following meetamit's suggestions and the example here, I have stumbled on what appears to be a solution.

First, in function makeYaxis(), I removed the line .append("g"). I also updated the class name to yaxis. The function now reads

function makeYaxis (chart, scale, nticks, label, width, height, xmf, visName)
{
    var yAxis = d3.svg.axis()
    .scale(scale)
    .orient("left")
    .ticks(nticks);
    chart.append("svg:g")
    .attr("class","yaxis") // note new class name
//  .append("g")
    .attr("transform","translate(60,1)") 
    .call(yAxis);
    // everything else as before
}

I then added an extra period in my call to select(".yaxis"):

chart.select(".yaxis").transition().duration(10).call(yAxis);

I would be very grateful if anyone could explain to me exactly why this solution appears to work.