title: D3.js How to update a global variable from d3.select()
body: <p>I'm stuck with a global/local variable issue.<br>
  Here, my code based on <a href="http://www.d3noob.org/2014/04/using-html-inputs-with-d3js.html" rel="nofollow">http://www.d3noob.org/2014/04/using-html-inputs-with-d3js.html</a></p>
  
  <p>index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;Input test (circle)&lt;/title&gt;
      &lt;head&gt;
          &lt;script src="http://d3js.org/d3.v3.min.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;p&gt;
            &lt;label for="nRadius" 
               style="display: inline-block; width: 240px; text-align: right"&gt;
               radius = &lt;span id="nRadius-value"&gt;…&lt;/span&gt;
            &lt;/label&gt;
            &lt;input type="range" min="1" max="150" id="nRadius"&gt;
          &lt;/p&gt;
          &lt;script src="./slider.js"&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>slider.js</p>
  
  <pre><code>// update the circle radius
  function update(nRadius) {
      // adjust the text on the range slider
      d3.select("#nRadius-value").text(nRadius);
      d3.select("#nRadius").property("value", nRadius);
  
      // update the circle radius
      circle.selectAll("circle").attr("r", nRadius);
      return nRadius;
      }
  
  var width = 600;
  var height = 300;     
  var circle = d3.select("body")
              .append("svg")
              .attr("width", width)    
              .attr("height", height);
  
  // Circle with no radius
  circle.append("circle")
        .attr("cx", 300)
        .attr("cy", 150) 
        .style("fill", "none")   
        .style("stroke", "blue");
  
  // Initial radius 
  update(50);
  
  // when the input range changes update the circle 
  d3.select("#nRadius").on("input", function() {
      update(+this.value);
      });
  </code></pre>
  
  <p>This code works just fine, but what I'd like to do is to be able to export 'this.value' outside the d3.select, in order to use it in some other function.</p>
  
  <p>The d3.select showed below already includes some suggestions found by googling my question:</p>
  
  <pre><code>var currentRadius = 0;
  d3.select("#nRadius").on("input", function() {
      currentRadius = +this.value
      console.log("Inside: " + currentRadius);
      currentRadius = update(currentRadius);
      });
  
  console.log("Outside: " + currentRadius);
  </code></pre>
  
  <p>But it doesn't work.</p>