Ich bin verwirrt darüber, wie ich eine D3-Auswahl für die spätere Verwendung speichere. Im folgenden Code habe ich eine "globale" Variable für meine Achsen, in der ich sie beim erstmaligen Erstellen speichere. Später kann ich diese Variable für bestimmte Dinge verwenden (hier zum Einstellen von Text), aber nicht für andere (hier zum Aktualisieren der Skala), die nur funktionieren, wenn ich die Achsen explizit (neu) auswähle.

Gibt es vielleicht etwas an der Gültigkeitsdauer von JavaScript-Variablen, das ich nicht verstehe? Jede Hilfe wird geschätzt!

Der relevante Code, viel aus dem verdichtetenvoller Kontext:

// 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);