40 lines
1.3 KiB
HTML
40 lines
1.3 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head lang="en">
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<title>Stacked Bar chart</title>
|
||
|
|
<link rel="stylesheet" href="../dist/angular-chart.css">
|
||
|
|
<link href="bootstrap.css" rel="stylesheet">
|
||
|
|
</head>
|
||
|
|
<body ng-app="examples">
|
||
|
|
<br/>
|
||
|
|
<div class="container"></div>
|
||
|
|
<div id="container" class="container">
|
||
|
|
<div class="row" ng-controller="StackedBarCtrl">
|
||
|
|
<div class="col-lg-6 col-sm-12">
|
||
|
|
<div class="panel panel-default">
|
||
|
|
<div class="panel-heading">Stacked Bar Chart</div>
|
||
|
|
<div class="panel-body">
|
||
|
|
<canvas class="chart chart-stacked-bar" data="data" labels="labels"></canvas>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script src="../bower_components/angular/angular.js"></script>
|
||
|
|
<script src="../bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
|
||
|
|
<script src="../bower_components/Chart.js/Chart.js"></script>
|
||
|
|
<script src="../bower_components/Chart.StackedBar.js/src/Chart.StackedBar.js"></script>
|
||
|
|
<script src="../angular-chart.js"></script>
|
||
|
|
<script src="app.js"></script>
|
||
|
|
<script>
|
||
|
|
// Create the 'chart-stacked-bar' class/attribute directive:
|
||
|
|
angular.module('examples')
|
||
|
|
.directive('chartStackedBar', function (ChartJsFactory) {
|
||
|
|
return new ChartJsFactory('StackedBar');
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|