title: JavaScript InfoVis Toolkit Error loading JSON from external file using AJAX
body: <p>I have the code snippet shown below in my application . What I am trying to accomplish is this: anytime a checkbox is clicked, the bar chart should be updated.</p>
  <p><strong>In my error console I'm getting:</strong></p>
  <p>&quot;Error: TypeError: values is undefined Source file:hit.js Line: 11017.</p>
  <p>I tried assigning the JSON directly in the function  (var json = ...) and it works as it should but I can't get it to work by loading the JSON from the file. What am I doing wrong?</p>
  <pre><code>    $(':checkbox').click(function () {
     init();
       
     function init()
     {
         var request = new XMLHttpRequest( );
         request.open(&quot;GET&quot;, &quot;GetGenes.php&quot;, false);
         request.send(null);
         var json = request.response;
         console.log(request.response);
      var barChart = new $jit.BarChart({
            //id of the visualization container
            injectInto: 'infovis',
            //whether to add animations
            animate: true,
            //horizontal or vertical barcharts
            orientation: 'horizontal',
            //bars separation
            barsOffset: 0.5,
            //visualization offset
            Margin: {
              top: 5,
              left: 5,
              right: 5,
              bottom: 5
            },
            //labels offset position
            labelOffset:5,
            //bars style
            type:'stacked',
            //whether to show the aggregation of the values
            showAggregates:true,
            //whether to show the labels for the bars
            showLabels:true,
            //label styles
            Label: {
              type: 'HTML', //Native or HTML
              size: 9,
              family: 'Arial',
              color: 'black'
            },
            //tooltip options
            Tips: {
              enable: true,
              onShow: function(tip, elem) {
                tip.innerHTML = &quot;&lt;b&gt;&quot; + elem.name + &quot;&lt;/b&gt;: &quot; + elem.value;
              }
            }
          });
          
           barChart.loadJSON(json);
     }
       
        
     
  })
  </code></pre>
  <p>genes.php contains:</p>
  <pre><code>echo &quot;{'label': ['label 1', 'label 2', 'label 3', 'label 4'],'values': [{'label': 'date A','values': [20, 40, 15, 5]}, {'label': 'date B','values': [30, 10, 45, 10]}, {'label': 'date E','values': [38, 20, 35, 17]}, {'label': 'date F','values': [58, 10, 35, 32]}, {'label''date D','values': [55, 60, 34, 38]}, {'label': 'date C','values': [26, 40, 25, 40]}]};&quot;;
  </code></pre>