title: Passing Variable to Google Piechart
body: <p>Im trying to pass a variable into the the google chart but when I do it the chart stops showing up, my goal is for the chart to change every time I put in a different number in the input field but im just getting no where right now. This is what I have, can someone please offer some guidance on what I am doing wrong?</p>
  
  <p>Javascript</p>
  
  <pre><code>    &lt;script type="text/javascript" src="https://www.google.com/jsapi"&gt;&lt;/script&gt;
  
      &lt;script type="text/javascript"&gt;
        google.load('visualization', '1', {packages: ['corechart']});
      &lt;/script&gt;
  
      &lt;script type="text/javascript"&gt;
           function numbers(){
              var work_field = document.forms['work_form']['work_n_field'].value;
              var work_div = document.getElementById('number-work');
              var numberschart = work_div.innerHTML = work_field;
              return false;
          };
  
          function drawVisualization() {
              // Create and populate the data table.
          var data = new google.visualization.DataTable();
          data.addColumn('string', 'Task');
          data.addColumn('number', 'Hours per Day');
          data.addRows(5);
          data.setValue(0, 0, 'Work');
  //Right here is where I pass my variable into the chart
          data.setValue(0, 1, numberschart);
  //And I leave the rest here until I define more input field.
          data.setValue(1, 0, 'Eat');
          data.setValue(1, 1, 2);
          data.setValue(2, 0, 'Commute');
          data.setValue(2, 1, 2);
  
          // Create and draw the visualization.
          new google.visualization.PieChart(document.getElementById('visualization')).
              draw(data, {
              title:"Mortgage Rates",
              colors: ['#a4b12d', '#818e0a', '#5c6601', '#f0fd79', '#dbe864'],
              });
        }    
        google.setOnLoadCallback(drawVisualization);
      &lt;/script&gt;
  </code></pre>
  
  <p>Html</p>
  
  <pre><code>  &lt;div id="visualization" style="width: 400px; height: 300px;"&gt;&lt;/div&gt;
      &lt;form name="work_form" onsubmit="return numbers()"&gt;
      &lt;label id="n-work-label"&gt;Work&lt;/label&gt;&lt;input name="work_n_field"/&gt;
      &lt;button name="submit" id="submit" value="submit" onclick="numbers()"&gt;Submit&lt;/button&gt;
      &lt;/form&gt;
      &lt;div id="number-work"&gt;&lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Any help is greatly appreciated, Thank you</p>
  
  <p>I have also added it to js fiddle, but when adding the chart to a resource it doesnt seem to detect it. <a href="http://jsfiddle.net/pkCCa/" rel="nofollow">http://jsfiddle.net/pkCCa/</a></p>