<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="style.css">
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.min.js"></script>
  <script type="text/javascript" src="https://cdn.rawgit.com/jtblin/angular-chart.js/master/dist/angular-chart.min.js"></script>
  <script src="script.js"></script>
</head>

<body ng-app="app">
  <div ng-controller="ControladorPrincipal">
    <canvas 
    class="chart chart-bar" 
    chart-data="datos" 
    chart-labels="etiquetas" 
    chart-series="series"></canvas>
  </div>
</body>

</html>
angular
  .module("app", ['chart.js']) // Le decimos que usaremos a chart.js
  .controller("ControladorPrincipal", ["$scope", function($scope) {
    $scope.etiquetas = ['2006', '2007', '2008', '2009'];
    $scope.series = ['Ventas', 'Gastos'];

    $scope.datos = [
      [65, 59, 80, 81],
      [28, 48, 40, 19]
    ];
  }]);
/* Styles go here */