Column Chart Directive Step 1

<!DOCTYPE html>
<html data-ng-app="angularD3">

<head>
  <script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
  <script type="text/javascript" src="app.js"></script>
</head>

<body data-ng-controller="randomDataCtrl">
  <p>{{ dataset }}</p>
  <button data-ng-click="generateDataset()">Update Data</button>
</body>

</html>

var app = angular.module('angularD3', []);
app.controller('randomDataCtrl', function($scope) {

  $scope.dataset = [];

  $scope.generateDataset = function() {
    $scope.dataset = []; // clear
    for (var i = 0; i < 20; i++) { // generate 25 numbers
      $scope.dataset.push(Math.floor(Math.random() * 70 + 30)); // generate numbers between 30 to 99
    }
  };

  $scope.generateDataset();
});