Google Chart with AngularJS

HTML

<script src="https://www.google.com/jsapi"></script>
<div ng-controller="MainController">
    <!--<div id="chart_div" style="width: 550px; height:330px;">          </div> -->
    <!--<p><input type=range min=2 max=50000 ng-model="datax[2][1]" /> {{datax[2][1]}}</p> -->
    <pie-chart data="chartData" options="{{options}}"></pie-chart>
</div>

CSS

body {
    font-size: 0.9em;
}
pie-chart {
}
.bottom {
    clear: both;
    font-size: 0.9em;
    color: grey;
    padding: 2em 1em 0 1em;
}
h2 {
    font-size: 1.3em;
    margin: 0.8em 0.5em 0.1em 0.5em;
}
input {
    font-size: 0.8em;
    width: 6em;
}
input.title {
    width: 12em;
}
tr.selected td {
    background-color: red;
}
.left {
    float: left;
    margin-right: 4em;
}

JavaScript

google.load('visualization', '1', {packages:['corechart']});

var app = angular.module('myApp', []);

app.controller('MainController', function($scope) {
    
    $scope.chartTitle = "Test Sources";
  
    $scope.chartData = [
        ['Ad Flyers', 11],
        ['Web (Organic)', 4],
        ['Web (PPC)', 4],
        ['Yellow Pages', 7],
        ['Showroom', 3]
    ];
    
    $scope.chartData = [
          ['Galaxy', 'Distance', 'Brightness'],
          ['Canis Major Dwarf', 8000, 23.3],
          ['Sagittarius Dwarf', 24000, 4.5],
          ['Ursa Major II Dwarf', 30000, 14.3],
          ['Lg. Magellanic Cloud', 50000, 0.9],
          ['Bootes I', 60000, 13.1]
        ];
    
    
    var options = {
    		animation:{
        	startup:true,
          duration:1000,
          easing:'out'
        },
        width: 550,
        height:330,
          series: {
            0: {targetAxisIndex: 0},
            1: {targetAxisIndex: 1}
          },
          title: 'Test Sources',
          vAxes: {
            // Adds titles to each axis.
            0: {title: 'parsecs'},
            1: {title: 'apparent magnitude'}
          }
    };

    /*var formatPercent = new google.visualization.NumberFormat({
        fractionDigits: 0,
        suffix: '%'
    });*/

    $scope.$watch('datax', function(newValue, oldValue) {
        var data = google.visualization.arrayToDataTable($scope.datax);
        
        formatPercent.format(data, 1);
        formatPercent.format(data, 2);
       /* chart.draw(data, options);*/
    }, true);
    
    
});

app.directive('pieChart', function ($timeout) {
    return {
        restrict: 'EA',
        scope: {
            chartData: '=data',
            options: '=options'
        },
        link: function ($scope, $elm, $attr) {

            // Create the data table and instantiate the chart
            //var data = new google.visualization.DataTable();
            //data.addColumn('string', 'Label');
            //data.addColumn('number',...