title: How to display javascript variable as text using D3
body: <p>I'm new to javascript. I'm using D3 to build some charts.  I'm wanting to display the number of mouse clicks over an SVG element.  </p>
  
  <p>Currently I can display the ellipse and can track the number of clicks on the ellipse.  I'm wanting to overlay the changing number of mouse clicks on the ellipse. </p>
  
  <p>I have it working so that the initial variable is displayed, but haven't been able to solve how to display the variable changes (ie additional mouse clicks).  I want it so that as soon as the ellipse is clicked on, the text is updated. </p>
  
  <p>My code is below. </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;script type="text/javascript" src="http://mbostock.github.com/d3/d3.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="viz"&gt;&lt;/div&gt;
      &lt;script type="text/javascript"&gt;
      var clicks = 0;
      var sampleSVG = d3.select("#viz")
          .append("svg:svg")
          .attr("width", 400)
          .attr("height", 800);    
      sampleSVG.append("svg:ellipse")
          .style("stroke", "gray")
          .style("fill", "white")
          .attr("rx", 20)
          .attr("ry", 25)
          .attr("cx", 50)
          .attr("cy", 50)
          .on("mouseover", function(){d3.select(this).style("fill", "aliceblue");})
          .on("mouseout", function(){d3.select(this).style("fill", "white");})
          .on("click", function(){clicks = clicks+1
                      })
      sampleSVG.append("svg:text")
          .text(clicks)
          .attr("x", 50)
          .attr("y", 50)
          .attr("fill", "black"); 
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I tried adding to
          sampleSVG.text(clicks)
  to my onclick function, but it didn't work. </p>
  
  <p>Also as a more general question, should my text (var clicks) be appended to sampleSVG 
  or should I create a new variable sampleText and overlay it over sampleSVG?</p>
  
  <p>THanks for the help</p>
  
  <p>R</p>