Estoy confundido acerca de cómo guardar una selección D3 para su uso posterior. En el siguiente código, tengo una variable "global" para mis ejes, en la que los guardo cuando se crean por primera vez. Más tarde, puedo usar esta variable para ciertas cosas (aquí, establecer un texto) pero no para otras (aquí, actualizar la escala), que solo funcionan si (re) selecciono explícitamente los ejes.

¿Acaso hay algo sobre el alcance variable de JavaScript o el tiempo de vida que no entiendo? Cualquier ayuda es apreciada!

El código relevante, muy condensado delcontexto completo:

// Top level of page

var gxaxis, gyaxis;

var updatePlot = function (view, first) {

    d3.csv("data.csv", function (error, data) {
        data.forEach(function (d) {
            ...
        });

        var x, y;
        x = d3.scale.linear().range(...);
        y = d3.scale.linear().range(...);

        x.domain(d3.extent(data, function (d) {...})).nice();
        y.domain(d3.extent(data, function (d) {...})).nice();

        var xAxis = d3.svg.axis().scale(x).orient("bottom");
        var yAxis = d3.svg.axis().scale(y).orient("left");

        // The variable 'first' is true on page load, so this code the if clause will be executed before any executions of the else clause
       if (first) {
            gxaxis = svg.append("g").attr("class", "x axis")
                    .attr("transform", "translate(0," + height + ")")
                    .call(xAxis)
                    .append("text")
                    .attr("class", "label")
                    .attr("x", width)
                    .attr("y", -6)
                    .style("text-anchor", "end");
            gyaxis = svg.append("g").attr("class", "y axis")
                    .call(yAxis)
                    .append("text")
                    .attr("class", "label")
                    .attr("transform", "rotate(-90)")
                    .attr("y", 6)
                    .attr("dy", ".71em")
                    .style("text-anchor", "end");
        } else {
            // Why is it necessary to explicitly select; why can't I use my gxaxis variable (as I do below for the text)?
            svg.select(".x.axis")
                    .transition().duration(0).ease("in")
                    .call(xAxis);
            // Using gyaxis.transition()... has NO EFFECT
            svg.select(".y.axis")
                    .transition().duration(0).ease("in")
                    .call(yAxis);

        }

        var xLabel = ...;
        var yLabel = ...;

        // This use of gxaxis works.
        gxaxis.text(xLabel);
        gyaxis.text(yLabel);

    });

};

// Set up handlers for switching among views
d3.selectAll(".view-select").on("click", function () {
    d3.event.preventDefault();
    updatePlot(this.id, false);
});

updatePlot('a', true);