title: How to use RequireJS AngularJS and Google Visualization API
body: <p>Wondering if anyone has gotten RequireJS, ANgularJS and Google Visualization API working together. I cannot seem to get the charts to function properly. 
  The main problem I am having is that the google.setOnLoadCallback() is not running.
  below is my code. I am not sold entirely on Google Visualization API if there is another chart library that is easier to use with RequireJS. </p>
  
  <pre><code>define([ 'jquery'],function ( $) {
  return function () {
      return {
          restrict: 'A',
  
          link: function (scope, lElement, attrs) {
  
              console.log("loaded google jsapi");
  
                console.log("google");
  
              google.load("visualization", "1", {packages:["corechart"]});
  
  
              google.setOnLoadCallback(drawChart);
              function drawChart() {
                  console.log("we are in the call back");
                  var data = google.visualization.arrayToDataTable([
                      ['Year', 'Sales', 'Expenses'],
                      ['2004',  1000,      400],
                      ['2005',  1170,      460],
                      ['2006',  660,       1120],
                      ['2007',  1030,      540]
                  ]);
  
                  var options = {
                      title: 'Company Performance',
                      vAxis: {title: 'Year',  titleTextStyle: {color: 'red'}}
                  };
  
                  var chart = new google.visualization.BarChart(lElement[0]);
                  chart.draw(data, options);
              }
  
              console.log("called google.load for visualization");
          }
      }
  }
  });
  </code></pre>
  
  <p>If anyone has gotten eh three working together perhaps you can explain or post a  link to a JSFidlle. </p>