graphique done
This commit is contained in:
parent
2c68445a4b
commit
3614a4bc1e
@ -178,7 +178,8 @@
|
||||
<div class="col-sm-12 col-lg-5">
|
||||
|
||||
<h2>Simulation sur {{config.lines}} mois</h2>
|
||||
<div id="simulation-prevision"></div>
|
||||
<div class="" id="simulationPrevision" style="display: inline-block; height: 300px; width: 90%;">(graphique)</div>
|
||||
|
||||
<!--block to insert the graph-->
|
||||
<div class="well" ng-if="config.monthsBeforeNoMoney < config.lines">
|
||||
Ce sera la dèche dans {{config.monthsBeforeNoMoney}} mois
|
||||
@ -201,7 +202,7 @@
|
||||
</trclass>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr ng-repeat="line in previsionTable()" >
|
||||
<tr ng-repeat="line in previsionTable" >
|
||||
<td>
|
||||
<div ng-if="line.available > config.warningThershold"
|
||||
class=" bgsuccess padded ">
|
||||
@ -240,5 +241,25 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>-->
|
||||
<script>
|
||||
|
||||
var dataPoints = {{graphPointsPrevision}} ;
|
||||
var chartContainerChiffreAffaire = new CanvasJS.Chart("simulationPrevision", {
|
||||
title:{
|
||||
text: "Euros disponibles dans le temps"
|
||||
},
|
||||
animationEnabled: true,
|
||||
data: [
|
||||
{
|
||||
// Change type to "doughnut", "line", "splineArea", etc.
|
||||
type: "splineArea",
|
||||
dataPoints: dataPoints
|
||||
}
|
||||
]
|
||||
});
|
||||
chartContainerChiffreAffaire.render();
|
||||
</script>
|
||||
|
||||
{% endverbatim %}
|
||||
{% endblock %}
|
@ -1,4 +1,4 @@
|
||||
// require('../../../node_modules/canvasjs/dist/canvasjs.3');
|
||||
require('../../../node_modules/canvasjs/dist/canvasjs.3');
|
||||
|
||||
var $ = require('jquery');
|
||||
// JS is equivalent to the normal "bootstrap" package
|
||||
@ -266,8 +266,8 @@ angular
|
||||
})
|
||||
return sum;
|
||||
};
|
||||
|
||||
$scope.previsionTable = () => {
|
||||
$scope.previsionTable = [];
|
||||
$scope.calculatePrevisionTable = () => {
|
||||
let turns = $scope.config.lines;
|
||||
let monthly = $scope.sumMonthlyExpenses();
|
||||
let available = $scope.config.disponibility;
|
||||
@ -286,10 +286,29 @@ angular
|
||||
}
|
||||
previsionTable.push(newLine);
|
||||
}
|
||||
$scope.previsionTable = previsionTable;
|
||||
$scope.makeGraphPointsOfPrevisionTable(previsionTable);
|
||||
return previsionTable;
|
||||
};
|
||||
$scope.graphPointsPrevision = [];
|
||||
$scope.makeGraphPointsOfPrevisionTable = (previsionTable) => {
|
||||
console.log("previsionTable", previsionTable);
|
||||
$scope.graphPointsPrevision = [];
|
||||
for (let i = 0; i < previsionTable.length; i++) {
|
||||
$scope.graphPointsPrevision.push({
|
||||
label: previsionTable[i].available + " euros restants dans " + i + " mois",
|
||||
y: previsionTable[i].available,
|
||||
x: i,
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
$scope.updateconf = (rep) => {
|
||||
// update view calculs
|
||||
$scope.calculatePrevisionTable();
|
||||
$scope.updateCanevas()
|
||||
// flags
|
||||
$scope.config.loading = false;
|
||||
$scope.config.initialLoadingDone = true;
|
||||
$scope.config.disponibility = rep.data.disponibility;
|
||||
@ -348,5 +367,22 @@ angular
|
||||
$scope.config.loading = false;
|
||||
|
||||
}
|
||||
$scope.updateCanevas = () => {
|
||||
var dataPoints = $scope.graphPointsPrevision;
|
||||
var chartContainer = new CanvasJS.Chart("simulationPrevision", {
|
||||
title: {
|
||||
text: "Euros disponibles dans le temps"
|
||||
},
|
||||
// animationEnabled: true,
|
||||
data: [
|
||||
{
|
||||
// Change type to "doughnut", "line", "splineArea", etc.
|
||||
type: "splineArea",
|
||||
dataPoints: dataPoints
|
||||
}
|
||||
]
|
||||
});
|
||||
chartContainer.render();
|
||||
}
|
||||
$scope.init();
|
||||
}]);
|
||||
|
Loading…
Reference in New Issue
Block a user