gwh/ledgerrb
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

interactive monthly graph

Browse source
This commit is contained in:
Gwenhael Le Moine 2015-09-03 16:55:58 +02:00
parent 14dedcf779
commit 2474f8c570
2 changed files with 35 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
public/app/js/controllers/DashboardCtrl.js
View file

@ -221,10 +221,14 @@ app.controller( 'DashboardCtrl',
return '<md-content><h3><em>' + key + '</em> during ' + x + '</h3><h2>' + y + ' €</h2></md-content>'; return '<md-content><h3><em>' + key + '</em> during ' + x + '</h3><h2>' + y + ' €</h2></md-content>';
}; };
}; };
$scope.graphed_accounts = [ 'Expenses', 'Income' ];
retrieve_accounts(); retrieve_accounts();
retrieve_dates_salaries(); retrieve_dates_salaries();
retrieve_graph_values( { period: '', $scope.$watch( 'graphed_accounts', function () {
categories: 'Expenses Income'} ); retrieve_graph_values( { period: '',
categories: $scope.graphed_accounts.join(' ') } );
} );
} }
] ); ] );

46
public/app/js/templates/dashboard.html
View file

@ -1,25 +1,37 @@
<md-toolbar flex="100" layout="column" layout-gt-md="row" layout-align="center center"> <md-toolbar flex="100" layout="column" layout-gt-md="row" layout-align="center center">
<h2> <h2>
<md-select data-ng-model="period"> <md-input-container>
<md-option data-ng-repeat="period in periods">{{period}}</md-option> <md-select data-ng-model="period">
</md-select> <md-option data-ng-repeat="period in periods">{{period}}</md-option>
</md-select>
</md-input-container>
</h2> </h2>
</md-toolbar> </md-toolbar>
<md-content flex="100"> <md-content flex="100" layout="column" layout-gt-md="row">
<nvd3-multi-bar-chart <md-card flex="20">
data="monthly_values" <md-input-container>
id="monthlyValues" <md-select multiple="true" data-ng-model="graphed_accounts">
height="350" <md-option data-ng-repeat="account in accounts">{{account}}</md-option>
showXAxis="true" </md-select>
showYAxis="true" </md-input-container>
showLegend="true" </md-card>
interactive="true" <md-card flex="75">
tooltips="true" <nvd3-multi-bar-chart
tooltipContent="barGraphToolTipContentFunction()" data="monthly_values"
rotateLabels="67"> id="monthlyValues"
<svg></svg> height="350"
</nvd3-multi-bar-chart> showXAxis="true"
showYAxis="true"
showLegend="true"
interactive="true"
tooltips="true"
tooltipContent="barGraphToolTipContentFunction()"
rotateLabels="67"
margin="{left:70,top:70,bottom:70,right:125}" >
<svg></svg>
</nvd3-multi-bar-chart>
</md-card>
</md-content> </md-content>
<md-content flex="100" layout="column" layout-gt-md="row"> <md-content flex="100" layout="column" layout-gt-md="row">