Tabellepflege abgeschlossen, Entwicklung eingebunden, Basiswerte und CSS-Fixes

2016-09-13 16:28:58 +02:00
parent 71867b9087
commit fa55d4fee9
94 changed files with 12014 additions and 62 deletions
--- a/www/lib/angular-chart.js/test/fixtures/29-tabs.html
+++ b/www/lib/angular-chart.js/test/fixtures/29-tabs.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Charts in tabs</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="examples">
+<br/>
+<div id="container" class="container">
+  <div class="row" ng-controller="TabsCtrl">
+    <tabset>
+      <tab heading="First tab" active="active">
+        <div class="panel-body">
+          <canvas class="chart chart-line" chart-data="data" chart-labels="labels"></canvas>
+        </div>
+      </tab>
+      <tab heading="Second tab">
+        <div class="panel-body">
+          <canvas class="chart chart-bar" chart-data="data" chart-labels="labels"></canvas>
+        </div>
+      </tab>
+    </tabset>
+  </div>
+</div>
+
+<script src="../../node_modules/angular/angular.js"></script>
+<script src="../../node_modules/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
+<script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+<script src="../../angular-chart.js"></script>
+<script src="29-tabs.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/29-tabs.js
+++ b/www/lib/angular-chart.js/test/fixtures/29-tabs.js
@@ -0,0 +1,18 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('examples', ['chart.js', 'ui.bootstrap']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.controller('TabsCtrl', function ($scope) {
+    $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
+    $scope.active = true;
+    $scope.data = [
+      [65, 59, 90, 81, 56, 55, 40],
+      [28, 48, 40, 19, 96, 27, 100]
+    ];
+  });
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/29-tabs.png
+++ b/www/lib/angular-chart.js/test/fixtures/29-tabs.png
--- a/www/lib/angular-chart.js/test/fixtures/51-pie-update-colours.html
+++ b/www/lib/angular-chart.js/test/fixtures/51-pie-update-colours.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Pie update colors</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="pie" id="top">
+  <div class="container">
+    <section id="charts">
+      <div class="page-header">
+        <h1>Charts</h1>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" ng-controller="PieCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Pie Chart</div>
+            <div class="panel-body">
+              <canvas class="chart chart-pie" chart-data="data" chart-labels="labels" chart-colors="colors"></canvas>
+            </div>
+            <p align="center"><a href="https://github.com/jtblin/angular-chart.js/issues/51">
+              https://github.com/jtblin/angular-chart.js/issues/51
+            </a></p>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+
+  <script src="../../node_modules/angular/angular.min.js"></script>
+  <script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+  <script src="../../angular-chart.js"></script>
+  <script src="51-pie-update-colours.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/51-pie-update-colours.js
+++ b/www/lib/angular-chart.js/test/fixtures/51-pie-update-colours.js
@@ -0,0 +1,34 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('pie', ['chart.js']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.controller('PieCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.labels = ['Series A', 'Series B'];
+    $scope.data = [65, 59];
+    $scope.colors = [{ // red
+      backgroundColor: 'rgba(247,70,74,0.2)',
+      borderColor: 'rgba(247,70,74,1)',
+      pointBackgroundColor: 'rgba(247,70,74,1)',
+      pointBorderColor: '#fff',
+      pointHoverBackgroundColor: '#fff',
+      pointHoverBorderColor: 'rgba(247,70,74,0.8)'
+    },
+      { // green
+        backgroundColor: 'rgba(70,191,189,0.2)',
+        borderColor: 'rgba(70,191,189,1)',
+        pointBackgroundColor: 'rgba(70,191,189,1)',
+        pointBorderColor: '#fff',
+        pointHoverBackgroundColor: '#fff',
+        pointHoverBorderColor: 'rgba(70,191,189,0.8)'
+      }];
+
+    $timeout(function () {
+      $scope.data = [49, 65];
+    }, 0);
+  }]);
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/51-pie-update-colours.png
+++ b/www/lib/angular-chart.js/test/fixtures/51-pie-update-colours.png
--- a/www/lib/angular-chart.js/test/fixtures/54-not-enough-colours.html
+++ b/www/lib/angular-chart.js/test/fixtures/54-not-enough-colours.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Not enough colors</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="pie" id="top">
+  <div class="container">
+    <section id="charts">
+      <div class="page-header">
+        <h1>Charts</h1>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" ng-controller="PieCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Pie Chart</div>
+            <div class="panel-body">
+              <canvas class="chart chart-pie" chart-data="data" chart-labels="labels"
+                      chart-colors="colors" chart-get-color="chartGetColor"></canvas>
+            </div>
+            <p align="center"><a href="https://github.com/jtblin/angular-chart.js/issues/51">
+              https://github.com/jtblin/angular-chart.js/issues/54
+            </a></p>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+
+  <script src="../../node_modules/angular/angular.min.js"></script>
+  <script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+  <script src="../../angular-chart.js"></script>
+  <script src="54-not-enough-colours.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/54-not-enough-colours.js
+++ b/www/lib/angular-chart.js/test/fixtures/54-not-enough-colours.js
@@ -0,0 +1,36 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('pie', ['chart.js']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.controller('PieCtrl', ['$scope', function ($scope) {
+    var cnt = 0;
+    $scope.colors = [];
+    $scope.labels = ['Series A', 'Series B'];
+    $scope.chartGetColor = function () {
+      return ++cnt % 2 > 0 ?
+      { // red
+        backgroundColor: 'rgba(247,70,74,0.2)',
+        borderColor: 'rgba(247,70,74,1)',
+        pointBackgroundColor: 'rgba(247,70,74,1)',
+        pointBorderColor: '#fff',
+        pointHoverBackgroundColor: '#fff',
+        pointHoverBorderColor: 'rgba(247,70,74,0.8)'
+      }
+        :
+      { // green
+        backgroundColor: 'rgba(70,191,189,0.2)',
+        borderColor: 'rgba(70,191,189,1)',
+        pointBackgroundColor: 'rgba(70,191,189,1)',
+        pointBorderColor: '#fff',
+        pointHoverBackgroundColor: '#fff',
+        pointHoverBorderColor: 'rgba(70,191,189,0.8)'
+      };
+    };
+    $scope.data = [49, 65];
+  }]);
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/54-not-enough-colours.png
+++ b/www/lib/angular-chart.js/test/fixtures/54-not-enough-colours.png
--- a/www/lib/angular-chart.js/test/fixtures/57-hex-colours.html
+++ b/www/lib/angular-chart.js/test/fixtures/57-hex-colours.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Hex colors</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="pie" id="top">
+  <div class="container">
+    <section id="charts">
+      <div class="page-header">
+        <h1>Charts</h1>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" ng-controller="PieCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Pie Chart</div>
+            <div class="panel-body">
+              <canvas class="chart chart-pie" chart-data="data" chart-labels="labels" chart-colors="colors"></canvas>
+            </div>
+            <p align="center"><a href="https://github.com/jtblin/angular-chart.js/issues/51">
+              https://github.com/jtblin/angular-chart.js/issues/57
+            </a></p>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+
+  <script src="../../node_modules/angular/angular.min.js"></script>
+  <script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+  <script src="../../angular-chart.js"></script>
+  <script src="57-hex-colours.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/57-hex-colours.js
+++ b/www/lib/angular-chart.js/test/fixtures/57-hex-colours.js
@@ -0,0 +1,15 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('pie', ['chart.js']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.controller('PieCtrl', ['$scope', function ($scope) {
+    $scope.labels = ['Series A', 'Series B'];
+    $scope.colors = ['#9AFEFF', '#D1D0CE'];
+    $scope.data = [49, 65];
+  }]);
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/57-hex-colours.png
+++ b/www/lib/angular-chart.js/test/fixtures/57-hex-colours.png
--- a/www/lib/angular-chart.js/test/fixtures/bubble.html
+++ b/www/lib/angular-chart.js/test/fixtures/bubble.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Bubble chart</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="app">
+<br/>
+<div id="container" class="container">
+  <div class="row" ng-controller="BubbleCtrl">
+    <div class="col-lg-6 col-sm-12">
+      <div class="panel panel-default">
+        <div class="panel-heading">Bubble chart</div>
+        <div class="panel-body">
+          <canvas class="chart chart-bubble" chart-data="data"
+                  chart-colors="colors" chart-options="options"></canvas>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<script src="../../node_modules/angular/angular.min.js"></script>
+<script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+<script src="../../angular-chart.js"></script>
+<script src="bubble.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/bubble.js
+++ b/www/lib/angular-chart.js/test/fixtures/bubble.js
@@ -0,0 +1,787 @@
+angular.module('app', ['chart.js'])
+  .config(['ChartJsProvider', function (ChartJsProvider) {
+    'use strict';
+    ChartJsProvider.setOptions({
+      tooltips: { enabled: false }
+    });
+  }])
+  .controller('BubbleCtrl', ['$scope',function ($scope) {
+    'use strict';
+
+    $scope.colors = [
+      {
+        backgroundColor: 'rgba(151,187,205,0.2)',
+        pointBackgroundColor: 'rgba(151,187,205,1)',
+        pointHoverBackgroundColor: 'rgba(151,187,205,0.8)',
+        borderColor: 'rgba(151,187,205,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(151,187,205,1)'
+      },
+      {
+        backgroundColor: 'rgba(220,220,220,0.2)',
+        pointBackgroundColor: 'rgba(220,220,220,1)',
+        pointHoverBackgroundColor: 'rgba(220,220,220,0.8)',
+        borderColor: 'rgba(220,220,220,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(220,220,220,1)'
+      },
+      {
+        backgroundColor: 'rgba(247,70,74,0.2)',
+        pointBackgroundColor: 'rgba(247,70,74,1)',
+        pointHoverBackgroundColor: 'rgba(247,70,74,0.8)',
+        borderColor: 'rgba(247,70,74,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(247,70,74,1)'
+      },
+      {
+        backgroundColor: 'rgba(70,191,189,0.2)',
+        pointBackgroundColor: 'rgba(70,191,189,1)',
+        pointHoverBackgroundColor: 'rgba(70,191,189,0.8)',
+        borderColor: 'rgba(70,191,189,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(70,191,189,1)'
+      },
+      {
+        backgroundColor: 'rgba(253,180,92,0.2)',
+        pointBackgroundColor: 'rgba(253,180,92,1)',
+        pointHoverBackgroundColor: 'rgba(253,180,92,0.8)',
+        borderColor: 'rgba(253,180,92,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(253,180,92,1)'
+      },
+      {
+        backgroundColor: 'rgba(148,159,177,0.2)',
+        pointBackgroundColor: 'rgba(148,159,177,1)',
+        pointHoverBackgroundColor: 'rgba(148,159,177,0.8)',
+        borderColor: 'rgba(148,159,177,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(148,159,177,1)'
+      },
+      {
+        backgroundColor: 'rgba(77,83,96,0.2)',
+        pointBackgroundColor: 'rgba(77,83,96,1)',
+        pointHoverBackgroundColor: 'rgba(77,83,96,0.8)',
+        borderColor: 'rgba(77,83,96,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(77,83,96,1)'
+      },
+      {
+        backgroundColor: 'rgba(151,57,74,0.2)',
+        pointBackgroundColor: 'rgba(151,57,74,1)',
+        pointHoverBackgroundColor: 'rgba(151,57,74,0.8)',
+        borderColor: 'rgba(151,57,74,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(151,57,74,1)'
+      },
+      {
+        backgroundColor: 'rgba(198,232,17,0.2)',
+        pointBackgroundColor: 'rgba(198,232,17,1)',
+        pointHoverBackgroundColor: 'rgba(198,232,17,0.8)',
+        borderColor: 'rgba(198,232,17,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(198,232,17,1)'
+      },
+      {
+        backgroundColor: 'rgba(39,249,229,0.2)',
+        pointBackgroundColor: 'rgba(39,249,229,1)',
+        pointHoverBackgroundColor: 'rgba(39,249,229,0.8)',
+        borderColor: 'rgba(39,249,229,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(39,249,229,1)'
+      },
+      {
+        backgroundColor: 'rgba(98,128,233,0.2)',
+        pointBackgroundColor: 'rgba(98,128,233,1)',
+        pointHoverBackgroundColor: 'rgba(98,128,233,0.8)',
+        borderColor: 'rgba(98,128,233,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(98,128,233,1)'
+      },
+      {
+        backgroundColor: 'rgba(195,99,4,0.2)',
+        pointBackgroundColor: 'rgba(195,99,4,1)',
+        pointHoverBackgroundColor: 'rgba(195,99,4,0.8)',
+        borderColor: 'rgba(195,99,4,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(195,99,4,1)'
+      },
+      {
+        backgroundColor: 'rgba(81,204,249,0.2)',
+        pointBackgroundColor: 'rgba(81,204,249,1)',
+        pointHoverBackgroundColor: 'rgba(81,204,249,0.8)',
+        borderColor: 'rgba(81,204,249,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(81,204,249,1)'
+      },
+      {
+        backgroundColor: 'rgba(159,197,163,0.2)',
+        pointBackgroundColor: 'rgba(159,197,163,1)',
+        pointHoverBackgroundColor: 'rgba(159,197,163,0.8)',
+        borderColor: 'rgba(159,197,163,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(159,197,163,1)'
+      },
+      {
+        backgroundColor: 'rgba(122,68,60,0.2)',
+        pointBackgroundColor: 'rgba(122,68,60,1)',
+        pointHoverBackgroundColor: 'rgba(122,68,60,0.8)',
+        borderColor: 'rgba(122,68,60,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(122,68,60,1)'
+      },
+      {
+        backgroundColor: 'rgba(183,199,142,0.2)',
+        pointBackgroundColor: 'rgba(183,199,142,1)',
+        pointHoverBackgroundColor: 'rgba(183,199,142,0.8)',
+        borderColor: 'rgba(183,199,142,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(183,199,142,1)'
+      },
+      {
+        backgroundColor: 'rgba(33,125,4,0.2)',
+        pointBackgroundColor: 'rgba(33,125,4,1)',
+        pointHoverBackgroundColor: 'rgba(33,125,4,0.8)',
+        borderColor: 'rgba(33,125,4,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(33,125,4,1)'
+      },
+      {
+        backgroundColor: 'rgba(100,33,169,0.2)',
+        pointBackgroundColor: 'rgba(100,33,169,1)',
+        pointHoverBackgroundColor: 'rgba(100,33,169,0.8)',
+        borderColor: 'rgba(100,33,169,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(100,33,169,1)'
+      },
+      {
+        backgroundColor: 'rgba(10,128,69,0.2)',
+        pointBackgroundColor: 'rgba(10,128,69,1)',
+        pointHoverBackgroundColor: 'rgba(10,128,69,0.8)',
+        borderColor: 'rgba(10,128,69,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(10,128,69,1)'
+      },
+      {
+        backgroundColor: 'rgba(55,144,44,0.2)',
+        pointBackgroundColor: 'rgba(55,144,44,1)',
+        pointHoverBackgroundColor: 'rgba(55,144,44,0.8)',
+        borderColor: 'rgba(55,144,44,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(55,144,44,1)'
+      },
+      {
+        backgroundColor: 'rgba(111,248,27,0.2)',
+        pointBackgroundColor: 'rgba(111,248,27,1)',
+        pointHoverBackgroundColor: 'rgba(111,248,27,0.8)',
+        borderColor: 'rgba(111,248,27,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(111,248,27,1)'
+      },
+      {
+        backgroundColor: 'rgba(241,104,154,0.2)',
+        pointBackgroundColor: 'rgba(241,104,154,1)',
+        pointHoverBackgroundColor: 'rgba(241,104,154,0.8)',
+        borderColor: 'rgba(241,104,154,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(241,104,154,1)'
+      },
+      {
+        backgroundColor: 'rgba(158,253,143,0.2)',
+        pointBackgroundColor: 'rgba(158,253,143,1)',
+        pointHoverBackgroundColor: 'rgba(158,253,143,0.8)',
+        borderColor: 'rgba(158,253,143,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(158,253,143,1)'
+      },
+      {
+        backgroundColor: 'rgba(186,25,134,0.2)',
+        pointBackgroundColor: 'rgba(186,25,134,1)',
+        pointHoverBackgroundColor: 'rgba(186,25,134,0.8)',
+        borderColor: 'rgba(186,25,134,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(186,25,134,1)'
+      },
+      {
+        backgroundColor: 'rgba(81,34,77,0.2)',
+        pointBackgroundColor: 'rgba(81,34,77,1)',
+        pointHoverBackgroundColor: 'rgba(81,34,77,0.8)',
+        borderColor: 'rgba(81,34,77,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(81,34,77,1)'
+      },
+      {
+        backgroundColor: 'rgba(254,6,184,0.2)',
+        pointBackgroundColor: 'rgba(254,6,184,1)',
+        pointHoverBackgroundColor: 'rgba(254,6,184,0.8)',
+        borderColor: 'rgba(254,6,184,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(254,6,184,1)'
+      },
+      {
+        backgroundColor: 'rgba(4,230,203,0.2)',
+        pointBackgroundColor: 'rgba(4,230,203,1)',
+        pointHoverBackgroundColor: 'rgba(4,230,203,0.8)',
+        borderColor: 'rgba(4,230,203,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(4,230,203,1)'
+      },
+      {
+        backgroundColor: 'rgba(204,31,79,0.2)',
+        pointBackgroundColor: 'rgba(204,31,79,1)',
+        pointHoverBackgroundColor: 'rgba(204,31,79,0.8)',
+        borderColor: 'rgba(204,31,79,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(204,31,79,1)'
+      },
+      {
+        backgroundColor: 'rgba(95,152,82,0.2)',
+        pointBackgroundColor: 'rgba(95,152,82,1)',
+        pointHoverBackgroundColor: 'rgba(95,152,82,0.8)',
+        borderColor: 'rgba(95,152,82,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(95,152,82,1)'
+      },
+      {
+        backgroundColor: 'rgba(120,249,206,0.2)',
+        pointBackgroundColor: 'rgba(120,249,206,1)',
+        pointHoverBackgroundColor: 'rgba(120,249,206,0.8)',
+        borderColor: 'rgba(120,249,206,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(120,249,206,1)'
+      },
+      {
+        backgroundColor: 'rgba(229,137,70,0.2)',
+        pointBackgroundColor: 'rgba(229,137,70,1)',
+        pointHoverBackgroundColor: 'rgba(229,137,70,0.8)',
+        borderColor: 'rgba(229,137,70,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(229,137,70,1)'
+      },
+      {
+        backgroundColor: 'rgba(54,98,166,0.2)',
+        pointBackgroundColor: 'rgba(54,98,166,1)',
+        pointHoverBackgroundColor: 'rgba(54,98,166,0.8)',
+        borderColor: 'rgba(54,98,166,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(54,98,166,1)'
+      },
+      {
+        backgroundColor: 'rgba(22,81,208,0.2)',
+        pointBackgroundColor: 'rgba(22,81,208,1)',
+        pointHoverBackgroundColor: 'rgba(22,81,208,0.8)',
+        borderColor: 'rgba(22,81,208,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(22,81,208,1)'
+      },
+      {
+        backgroundColor: 'rgba(139,248,40,0.2)',
+        pointBackgroundColor: 'rgba(139,248,40,1)',
+        pointHoverBackgroundColor: 'rgba(139,248,40,0.8)',
+        borderColor: 'rgba(139,248,40,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(139,248,40,1)'
+      },
+      {
+        backgroundColor: 'rgba(139,221,190,0.2)',
+        pointBackgroundColor: 'rgba(139,221,190,1)',
+        pointHoverBackgroundColor: 'rgba(139,221,190,0.8)',
+        borderColor: 'rgba(139,221,190,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(139,221,190,1)'
+      },
+      {
+        backgroundColor: 'rgba(230,218,251,0.2)',
+        pointBackgroundColor: 'rgba(230,218,251,1)',
+        pointHoverBackgroundColor: 'rgba(230,218,251,0.8)',
+        borderColor: 'rgba(230,218,251,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(230,218,251,1)'
+      },
+      {
+        backgroundColor: 'rgba(245,21,15,0.2)',
+        pointBackgroundColor: 'rgba(245,21,15,1)',
+        pointHoverBackgroundColor: 'rgba(245,21,15,0.8)',
+        borderColor: 'rgba(245,21,15,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(245,21,15,1)'
+      },
+      {
+        backgroundColor: 'rgba(36,166,81,0.2)',
+        pointBackgroundColor: 'rgba(36,166,81,1)',
+        pointHoverBackgroundColor: 'rgba(36,166,81,0.8)',
+        borderColor: 'rgba(36,166,81,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(36,166,81,1)'
+      },
+      {
+        backgroundColor: 'rgba(177,41,153,0.2)',
+        pointBackgroundColor: 'rgba(177,41,153,1)',
+        pointHoverBackgroundColor: 'rgba(177,41,153,0.8)',
+        borderColor: 'rgba(177,41,153,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(177,41,153,1)'
+      },
+      {
+        backgroundColor: 'rgba(44,173,178,0.2)',
+        pointBackgroundColor: 'rgba(44,173,178,1)',
+        pointHoverBackgroundColor: 'rgba(44,173,178,0.8)',
+        borderColor: 'rgba(44,173,178,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(44,173,178,1)'
+      },
+      {
+        backgroundColor: 'rgba(134,50,197,0.2)',
+        pointBackgroundColor: 'rgba(134,50,197,1)',
+        pointHoverBackgroundColor: 'rgba(134,50,197,0.8)',
+        borderColor: 'rgba(134,50,197,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(134,50,197,1)'
+      },
+      {
+        backgroundColor: 'rgba(176,188,149,0.2)',
+        pointBackgroundColor: 'rgba(176,188,149,1)',
+        pointHoverBackgroundColor: 'rgba(176,188,149,0.8)',
+        borderColor: 'rgba(176,188,149,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(176,188,149,1)'
+      },
+      {
+        backgroundColor: 'rgba(92,9,164,0.2)',
+        pointBackgroundColor: 'rgba(92,9,164,1)',
+        pointHoverBackgroundColor: 'rgba(92,9,164,0.8)',
+        borderColor: 'rgba(92,9,164,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(92,9,164,1)'
+      },
+      {
+        backgroundColor: 'rgba(184,93,102,0.2)',
+        pointBackgroundColor: 'rgba(184,93,102,1)',
+        pointHoverBackgroundColor: 'rgba(184,93,102,0.8)',
+        borderColor: 'rgba(184,93,102,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(184,93,102,1)'
+      },
+      {
+        backgroundColor: 'rgba(1,235,91,0.2)',
+        pointBackgroundColor: 'rgba(1,235,91,1)',
+        pointHoverBackgroundColor: 'rgba(1,235,91,0.8)',
+        borderColor: 'rgba(1,235,91,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(1,235,91,1)'
+      },
+      {
+        backgroundColor: 'rgba(148,100,155,0.2)',
+        pointBackgroundColor: 'rgba(148,100,155,1)',
+        pointHoverBackgroundColor: 'rgba(148,100,155,0.8)',
+        borderColor: 'rgba(148,100,155,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(148,100,155,1)'
+      },
+      {
+        backgroundColor: 'rgba(17,253,128,0.2)',
+        pointBackgroundColor: 'rgba(17,253,128,1)',
+        pointHoverBackgroundColor: 'rgba(17,253,128,0.8)',
+        borderColor: 'rgba(17,253,128,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(17,253,128,1)'
+      },
+      {
+        backgroundColor: 'rgba(107,59,91,0.2)',
+        pointBackgroundColor: 'rgba(107,59,91,1)',
+        pointHoverBackgroundColor: 'rgba(107,59,91,0.8)',
+        borderColor: 'rgba(107,59,91,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(107,59,91,1)'
+      },
+      {
+        backgroundColor: 'rgba(105,111,203,0.2)',
+        pointBackgroundColor: 'rgba(105,111,203,1)',
+        pointHoverBackgroundColor: 'rgba(105,111,203,0.8)',
+        borderColor: 'rgba(105,111,203,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(105,111,203,1)'
+      },
+      {
+        backgroundColor: 'rgba(86,123,134,0.2)',
+        pointBackgroundColor: 'rgba(86,123,134,1)',
+        pointHoverBackgroundColor: 'rgba(86,123,134,0.8)',
+        borderColor: 'rgba(86,123,134,1)',
+        pointBorderColor: '#fff',
+        pointHoverBorderColor: 'rgba(86,123,134,1)'
+      }
+    ];
+
+    $scope.options = {
+      scales: {
+        xAxes: [{
+          display: false,
+          ticks: {
+            max: 125,
+            min: -125,
+            stepSize: 10
+          }
+        }],
+        yAxes: [{
+          display: false,
+          ticks: {
+            max: 125,
+            min: -125,
+            stepSize: 10
+          }
+        }]
+      }
+    };
+
+    $scope.data = [
+      [
+        {
+          x: -8,
+          y: -72,
+          r: 20.5
+        }
+      ],
+      [
+        {
+          x: -14,
+          y: -32,
+          r: 14.25
+        }
+      ],
+      [
+        {
+          x: 0,
+          y: 86,
+          r: 15
+        }
+      ],
+      [
+        {
+          x: -13,
+          y: 58,
+          r: 7.75
+        }
+      ],
+      [
+        {
+          x: 22,
+          y: -60,
+          r: 9.25
+        }
+      ],
+      [
+        {
+          x: 84,
+          y: -25,
+          r: 15.25
+        }
+      ],
+      [
+        {
+          x: 14,
+          y: 85,
+          r: 23.25
+        }
+      ],
+      [
+        {
+          x: -2,
+          y: 37,
+          r: 10.75
+        }
+      ],
+      [
+        {
+          x: -40,
+          y: 69,
+          r: 0.75
+        }
+      ],
+      [
+        {
+          x: -62,
+          y: -46,
+          r: 19.5
+        }
+      ],
+      [
+        {
+          x: 4,
+          y: -1,
+          r: 0.25
+        }
+      ],
+      [
+        {
+          x: -34,
+          y: 67,
+          r: 17.5
+        }
+      ],
+      [
+        {
+          x: -21,
+          y: -88,
+          r: 16.25
+        }
+      ],
+      [
+        {
+          x: 90,
+          y: 80,
+          r: 24.75
+        }
+      ],
+      [
+        {
+          x: 7,
+          y: 93,
+          r: 20.75
+        }
+      ],
+      [
+        {
+          x: 48,
+          y: 39,
+          r: 7.75
+        }
+      ],
+      [
+        {
+          x: 99,
+          y: -20,
+          r: 2.75
+        }
+      ],
+      [
+        {
+          x: -48,
+          y: 52,
+          r: 4.5
+        }
+      ],
+      [
+        {
+          x: -57,
+          y: -39,
+          r: 21
+        }
+      ],
+      [
+        {
+          x: 31,
+          y: -58,
+          r: 3.25
+        }
+      ],
+      [
+        {
+          x: 96,
+          y: 62,
+          r: 10.25
+        }
+      ],
+      [
+        {
+          x: 58,
+          y: -54,
+          r: 19.5
+        }
+      ],
+      [
+        {
+          x: 8,
+          y: 73,
+          r: 12
+        }
+      ],
+      [
+        {
+          x: 67,
+          y: 97,
+          r: 8.5
+        }
+      ],
+      [
+        {
+          x: -47,
+          y: -57,
+          r: 25
+        }
+      ],
+      [
+        {
+          x: 0,
+          y: -97,
+          r: 23.5
+        }
+      ],
+      [
+        {
+          x: -55,
+          y: -27,
+          r: 2
+        }
+      ],
+      [
+        {
+          x: 68,
+          y: 9,
+          r: 12.25
+        }
+      ],
+      [
+        {
+          x: -5,
+          y: 63,
+          r: 20.75
+        }
+      ],
+      [
+        {
+          x: 80,
+          y: 31,
+          r: 18.75
+        }
+      ],
+      [
+        {
+          x: 47,
+          y: -21,
+          r: 2.5
+        }
+      ],
+      [
+        {
+          x: -72,
+          y: 94,
+          r: 1.25
+        }
+      ],
+      [
+        {
+          x: 11,
+          y: -90,
+          r: 5.25
+        }
+      ],
+      [
+        {
+          x: 45,
+          y: -20,
+          r: 3.5
+        }
+      ],
+      [
+        {
+          x: 99,
+          y: 42,
+          r: 8.5
+        }
+      ],
+      [
+        {
+          x: -8,
+          y: -65,
+          r: 11
+        }
+      ],
+      [
+        {
+          x: -30,
+          y: -68,
+          r: 19
+        }
+      ],
+      [
+        {
+          x: -56,
+          y: 19,
+          r: 1
+        }
+      ],
+      [
+        {
+          x: -22,
+          y: 46,
+          r: 9
+        }
+      ],
+      [
+        {
+          x: 8,
+          y: 25,
+          r: 1
+        }
+      ],
+      [
+        {
+          x: -36,
+          y: -64,
+          r: 0.5
+        }
+      ],
+      [
+        {
+          x: 13,
+          y: -6,
+          r: 23.5
+        }
+      ],
+      [
+        {
+          x: 41,
+          y: 45,
+          r: 3.75
+        }
+      ],
+      [
+        {
+          x: -84,
+          y: 39,
+          r: 10.25
+        }
+      ],
+      [
+        {
+          x: 27,
+          y: -96,
+          r: 23.5
+        }
+      ],
+      [
+        {
+          x: -14,
+          y: -83,
+          r: 25
+        }
+      ],
+      [
+        {
+          x: -89,
+          y: -78,
+          r: 1
+        }
+      ],
+      [
+        {
+          x: -43,
+          y: -6,
+          r: 2.5
+        }
+      ],
+      [
+        {
+          x: 3,
+          y: 71,
+          r: 0
+        }
+      ],
+      [
+        {
+          x: 11,
+          y: 53,
+          r: 4.25
+        }
+      ]
+    ];
+  }]);
--- a/www/lib/angular-chart.js/test/fixtures/bubble.png
+++ b/www/lib/angular-chart.js/test/fixtures/bubble.png
--- a/www/lib/angular-chart.js/test/fixtures/charts.html
+++ b/www/lib/angular-chart.js/test/fixtures/charts.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Charts</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="charts" id="top">
+  <div class="container">
+    <section id="charts">
+      <div class="page-header">
+        <h1>Charts</h1>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" id="line-chart" ng-controller="LineCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Line Chart</div>
+            <div class="panel-body">
+              <canvas id="line" class="chart chart-line" chart-data="data" chart-labels="labels" chart-series="series"></canvas>
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-4 col-sm-12" id="bar-chart" ng-controller="BarCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Bar Chart</div>
+            <div class="panel-body">
+              <canvas id="bar" class="chart chart-bar" chart-data="data" chart-labels="labels"
+                      chart-series="series" chart-options="options"></canvas>
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-4 col-sm-12" id="doughnut-chart" ng-controller="DoughnutCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Doughnut Chart</div>
+            <div class="panel-body">
+              <canvas id="doughnut" class="chart chart-doughnut" chart-data="data" chart-labels="labels"></canvas>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" id="radar-chart" ng-controller="RadarCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Radar Chart</div>
+            <div class="panel-body">
+              <canvas id="area" class="chart chart-radar" chart-data="data" chart-labels="labels"></canvas>
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-4 col-sm-12" id="pie-chart" ng-controller="PieCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Pie Chart</div>
+            <div class="panel-body">
+              <canvas id="pie" class="chart chart-pie" chart-data="data" chart-labels="labels"></canvas>
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-4 col-sm-12" id="polar area-chart" ng-controller="PolarAreaCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Polar Area Chart</div>
+            <div class="panel-body">
+              <canvas id="polar" class="chart chart-polar-area" chart-data="data" chart-labels="labels"></canvas>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="row">
+      </div>
+    </section>
+  </div>
+
+  <script src="../../node_modules/angular/angular.min.js"></script>
+  <script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+  <script src="../../angular-chart.js"></script>
+  <script src="charts.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/charts.js
+++ b/www/lib/angular-chart.js/test/fixtures/charts.js
@@ -0,0 +1,68 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('charts', ['chart.js']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.controller('LineCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
+    $scope.series = ['Series A', 'Series B'];
+    $scope.data = [
+      [65, 59, 80, 81, 56, 55, 40],
+      [28, 48, 40, 19, 86, 27, 90]
+    ];
+    $timeout(function () {
+      $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
+      $scope.data = [
+        [28, 48, 40, 19, 86, 27, 90],
+        [65, 59, 80, 81, 56, 55, 40]
+      ];
+      $scope.series = ['Series C', 'Series D'];
+    }, 0);
+  }]);
+
+  app.controller('BarCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.options = { scaleShowVerticalLines: false };
+    $scope.labels = ['2006', '2007', '2008', '2009', '2010', '2011', '2012'];
+    $scope.series = ['Series A', 'Series B'];
+    $scope.data = [
+      [65, 59, 80, 81, 56, 55, 40],
+      [28, 48, 40, 19, 86, 27, 90]
+    ];
+    $timeout(function () {
+      $scope.options = { scaleShowVerticalLines: true };
+    }, 0);
+  }]);
+
+  app.controller('DoughnutCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail-Order Sales'];
+    $scope.data = [0, 0, 0];
+    // TODO: investigate why chart was not showing up without this hack
+    $timeout(function () {
+      $scope.data = [350, 450, 100];
+    }, 0);
+  }]);
+
+  app.controller('PieCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail Sales'];
+    $scope.data = [0, 0, 0];
+    $timeout(function () {
+      $scope.data = [350, 450, 100];
+    }, 0);
+  }]);
+
+  app.controller('PolarAreaCtrl', function ($scope) {
+    $scope.labels = ['Download Sales', 'In-Store Sales', 'Mail Sales', 'Telesales', 'Corporate Sales'];
+    $scope.data = [300, 500, 100, 40, 120];
+  });
+
+  app.controller('RadarCtrl', function ($scope) {
+    $scope.labels = ['Eating', 'Drinking', 'Sleeping', 'Designing', 'Coding', 'Cycling', 'Running'];
+    $scope.data = [
+      [65, 59, 90, 81, 56, 55, 40],
+      [28, 48, 40, 19, 96, 27, 100]
+    ];
+  });
+})();
--- a/www/lib/angular-chart.js/test/fixtures/charts.png
+++ b/www/lib/angular-chart.js/test/fixtures/charts.png
--- a/www/lib/angular-chart.js/test/fixtures/configure-line-chart.html
+++ b/www/lib/angular-chart.js/test/fixtures/configure-line-chart.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Pie update colors</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="line" id="top">
+  <div class="container">
+    <section id="charts">
+      <div class="page-header">
+        <h1>Charts</h1>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" ng-controller="LineCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Line Chart</div>
+            <div class="panel-body">
+              <canvas class="chart chart-line" chart-options="options" chart-data="data"
+                      chart-labels="labels" chart-colors="colors"></canvas>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+
+  <script src="../../node_modules/angular/angular.min.js"></script>
+  <script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+  <script src="../../angular-chart.js"></script>
+  <script src="configure-line-chart.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/configure-line-chart.js
+++ b/www/lib/angular-chart.js/test/fixtures/configure-line-chart.js
@@ -0,0 +1,33 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('line', ['chart.js']);
+
+  app.config(function (ChartJsProvider) {
+    // Configure all charts
+    ChartJsProvider.setOptions({
+      chartColors: ['#FF5252', '#FF8A80']
+    });
+    // Configure all line charts
+    ChartJsProvider.setOptions('line', {
+      showLines: false
+    });
+  });
+
+  app.controller('LineCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.labels = ['Series A', 'Series B'];
+    $scope.data = [[15, 23], [59, 80]];
+
+    // Configure only this instance
+    $scope.options = {
+      legend: {
+        display: false
+      }
+    };
+
+    $timeout(function () {
+      $scope.data = [[15, 23], [59, 80]];
+    }, 0);
+  }]);
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/configure-line-chart.png
+++ b/www/lib/angular-chart.js/test/fixtures/configure-line-chart.png
--- a/www/lib/angular-chart.js/test/fixtures/coverage.js
+++ b/www/lib/angular-chart.js/test/fixtures/coverage.js
--- a/www/lib/angular-chart.js/test/fixtures/custom-directive.html
+++ b/www/lib/angular-chart.js/test/fixtures/custom-directive.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Pie update colors</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="pie" id="top">
+  <div class="container">
+    <section id="charts">
+      <div class="page-header">
+        <h1>Charts</h1>
+      </div>
+      <div class="row">
+        <div class="col-lg-4 col-sm-12" ng-controller="PieCtrl">
+          <div class="panel panel-default">
+            <div class="panel-heading">Pie Chart</div>
+            <div class="panel-body">
+              <canvas class="chart my-special-pie" chart-data="data" chart-labels="labels" chart-colors="colors"></canvas>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
+
+  <script src="../../node_modules/angular/angular.min.js"></script>
+  <script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+  <script src="../../angular-chart.js"></script>
+  <script src="custom-directive.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/custom-directive.js
+++ b/www/lib/angular-chart.js/test/fixtures/custom-directive.js
@@ -0,0 +1,20 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('pie', ['chart.js']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.directive('mySpecialPie', function (ChartJsFactory) { return new ChartJsFactory('pie'); });
+
+  app.controller('PieCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
+    $scope.labels = ['Series A', 'Series B'];
+    $scope.data = [5, 59];
+
+    $timeout(function () {
+      $scope.data = [5, 65];
+    }, 0);
+  }]);
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/custom-directive.png
+++ b/www/lib/angular-chart.js/test/fixtures/custom-directive.png
--- a/www/lib/angular-chart.js/test/fixtures/dataset-override.html
+++ b/www/lib/angular-chart.js/test/fixtures/dataset-override.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Charts with datasets overrides</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="app">
+<br/>
+<div id="container" class="container">
+  <div class="page-header">
+    <h1>Dataset overrides</h1>
+  </div>
+  <div class="row" ng-controller="OverrideCtrl">
+    <div class="col-lg-6 col-sm-12">
+      <div class="panel panel-default">
+        <div class="panel-heading">Mixed chart</div>
+        <div class="panel-body">
+          <canvas class="chart chart-bar" chart-data="data1" chart-labels="labels1"
+                  chart-colors="colors" chart-dataset-override="datasetOverride1"></canvas>
+        </div>
+      </div>
+    </div>
+    <div class="col-lg-6 col-sm-12">
+      <div class="panel panel-default">
+        <div class="panel-heading">Doughnut dataset override</div>
+        <div class="panel-body">
+          <canvas class="chart chart-doughnut" chart-data="data2" chart-labels="labels2"
+                  chart-colors="colors" chart-dataset-override="datasetOverride2"></canvas>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<script src="../../node_modules/angular/angular.min.js"></script>
+<script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+<script src="../../angular-chart.js"></script>
+<script src="dataset-override.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/dataset-override.js
+++ b/www/lib/angular-chart.js/test/fixtures/dataset-override.js
@@ -0,0 +1,32 @@
+angular.module('app', ['chart.js']).controller('OverrideCtrl', ['$scope', function ($scope) {
+  'use strict';
+
+  $scope.colors = ['#45b7cd', '#ff6384', '#ff8e72'];
+
+  $scope.labels1 = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
+  $scope.data1 = [
+    [65, -59, 80, 81, -56, 55, -40],
+    [28, 48, -40, 19, 86, 27, 90]
+  ];
+  $scope.datasetOverride1 = [
+    {
+      label: 'Override Series A',
+      borderWidth: 1,
+      type: 'bar'
+    },
+    {
+      label: 'Override Series B',
+      borderWidth: 3,
+      hoverBackgroundColor: 'rgba(255,99,132,0.4)',
+      hoverBorderColor: 'rgba(255,99,132,1)',
+      type: 'line'
+    }
+  ];
+
+  $scope.labels2 = ['Download Sales', 'In-Store Sales', 'Mail-Order Sales'];
+  $scope.data2 = [350, 450, 100];
+  $scope.datasetOverride2 = {
+    hoverBackgroundColor: ['#45b7cd', '#ff6384', '#ff8e72'],
+    hoverBorderColor: ['#45b7cd', '#ff6384', '#ff8e72']
+  };
+}]);
--- a/www/lib/angular-chart.js/test/fixtures/dataset-override.png
+++ b/www/lib/angular-chart.js/test/fixtures/dataset-override.png
--- a/www/lib/angular-chart.js/test/fixtures/horizontal-bar-chart.html
+++ b/www/lib/angular-chart.js/test/fixtures/horizontal-bar-chart.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+  <meta charset="UTF-8">
+  <title>Horizontal Bar Chart</title>
+  <link href="../../examples/bootstrap.css" rel="stylesheet">
+</head>
+<body ng-app="horizontal" id="top">
+<div class="container">
+  <section id="charts">
+    <div class="page-header">
+      <h1>Horizontal Bar Chart</h1>
+    </div>
+    <div class="row">
+      <div class="col-lg-6 col-sm-12" ng-controller="HorizontalBarCtrl">
+        <div class="panel panel-default">
+          <div class="panel-heading">Horizontal Bar Chart</div>
+          <div class="panel-body">
+            <canvas class="chart chart-horizontal-bar " chart-options="options" chart-data="data"
+                    chart-labels="labels" chart-colors="colors"></canvas>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</div>
+
+<script src="../../node_modules/angular/angular.min.js"></script>
+<script src="../../node_modules/chart.js/dist/Chart.min.js"></script>
+<script src="../../angular-chart.js"></script>
+<script src="horizontal-bar-chart.js"></script>
+</body>
+</html>
--- a/www/lib/angular-chart.js/test/fixtures/horizontal-bar-chart.js
+++ b/www/lib/angular-chart.js/test/fixtures/horizontal-bar-chart.js
@@ -0,0 +1,18 @@
+(function () {
+  'use strict';
+
+  var app = angular.module('horizontal', ['chart.js']);
+  Chart.defaults.global.legend = {
+    display: false
+  };
+
+  app.controller('HorizontalBarCtrl', function ($scope) {
+    $scope.labels = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
+    $scope.active = true;
+    $scope.data = [
+      [65, 59, 90, 81, 56, 55, 40],
+      [28, 48, 40, 19, 96, 27, 100]
+    ];
+  });
+
+})();
--- a/www/lib/angular-chart.js/test/fixtures/horizontal-bar-chart.png
+++ b/www/lib/angular-chart.js/test/fixtures/horizontal-bar-chart.png