Merge pull request 'fix:SCurve chart' (#5) from dev-wahyun into master

Reviewed-on: #5

view-mode/function/overlaySCurve.js

@@ -167,9 +167,8 @@ function adjustDataToZoom(dates, data, chartScaleRange, zoomLevel) {
 		}
 	}
 
-	// If there are remaining data points after the loop, add them to the result
 	if (aggregateValue > 0) {
-		newData.push(aggregateValue);
+		newData.push(+(Math.round(aggregateValue+ "e+2") + "e-2"));
 		newDates.push(dates[data.length - 1]);
 	}
 
@@ -179,42 +178,44 @@ function adjustDataToZoom(dates, data, chartScaleRange, zoomLevel) {
 	};
 }
 
+function calculateMonthDifference(startDate, endDate) {
+    let startYear = startDate.getFullYear();
+    let startMonth = startDate.getMonth();
+    let endYear = endDate.getFullYear();
+    let endMonth = endDate.getMonth();
+    
+    let totalMonths = (endYear - startYear) * 12 + (endMonth - startMonth);
+    return totalMonths;
+}
+
 function getScalePaddings(values) {
 	let zoom = gantt.ext.zoom.getCurrentLevel();
 	var scale = gantt.getScale();
 	var dataRange = gantt.getSubtaskDates();
-	// let minDate = new Date();
-	// let maxDate = new Date();
 	let minValueDate = new Date(values.dates[0]);
 	let maxValueDate = new Date(values.dates[values.dates.length - 1]);
 
-	// gantt.eachTask(function(task){
-	//     let plannedEarlier = task.planned_start < task.start_date;
-	//     let plannedLater = task.planned_end > task.end_date;
-
-	//     if (plannedEarlier) {
-	//         minDate = new Date(Math.min(minDate.getTime(), task.planned_start.getTime()));
-	//     } else {
-	//         minDate = new Date(Math.min(minDate.getTime(), task.start_date.getTime()));
-	//     }
-
-	//     if (plannedLater) {
-	//         maxDate = new Date(Math.max(maxDate.getTime(), task.planned_end.getTime()));
-	//     } else {
-	//         maxDate = new Date(Math.max(maxDate.getTime(), task.end_date.getTime()));
-	//     }
-	// })
-
 	var padding = {
 		left: 0,
 		right: 0
 	};
 
-	if (dataRange.start_date) {
+	if(dataRange.start_date){
 		var yScaleLabelsWidth = 48;
-		// fine tune values in order to align chart with the scale range
+		let monthDifference = calculateMonthDifference(minValueDate, maxValueDate);
-		padding.left = gantt.posFromDate(minValueDate);
+		if(monthDifference >= 0 && monthDifference <= 3) {
-		padding.right = scale.full_width - gantt.posFromDate(maxValueDate);
+			padding.left = gantt.posFromDate(minValueDate) +5;
+			padding.right = scale.full_width - gantt.posFromDate(maxValueDate) - yScaleLabelsWidth;
+		}
+		if(monthDifference >= 4 && monthDifference <= 7) {
+			padding.left = gantt.posFromDate(minValueDate) - 2;
+			padding.right = scale.full_width - gantt.posFromDate(maxValueDate) - yScaleLabelsWidth;
+		}
+		if(monthDifference >= 8) {
+			padding.left = gantt.posFromDate(minValueDate) - 2;
+			padding.right = scale.full_width - gantt.posFromDate(maxValueDate) - yScaleLabelsWidth;
+		}
+
 		padding.top = gantt.config.row_height - 12;
 		padding.bottom = gantt.config.row_height - 12;
 	}
@@ -222,33 +223,23 @@ function getScalePaddings(values) {
 }
 
 var myChart;
-var lineOverlay = overlayControl.addOverlay(function (container) {
+var lineOverlay = overlayControl.addOverlay(function(container) {
 	var values = getProgressLine();
 	var scaleLabels = [];
 
-	//   if(parts[2] && parts[2] == '1'){
+	values.planned = values.planned.map(value => +(Math.round(value + "e+2") + "e-2"));
-	//     values.dates.forEach(function(date){
+	values.real = values.real.map(value => +(Math.round(value + "e+2") + "e-2"));
-	//       var dateScale = new Date(date);
+    values.dates.forEach(function(date){
-	//       scaleLabels.push(dateToStr(dateScale));
+      var dateScale = new Date(date);
-	//     })
+      scaleLabels.push(dateToStr(dateScale));
-	//   } else {
+    })
-	//     var chartScale = getChartScaleRange();
-
-	//     chartScale.forEach(function(date){
-	//       scaleLabels.push(dateToStr(date));
-	//     });
-	//   }
-	values.dates.forEach(function (date) {
-		var dateScale = new Date(date);
-		scaleLabels.push(dateToStr(dateScale));
-	})
 	var canvas = document.createElement("canvas");
 	container.appendChild(canvas);
 	canvas.style.height = container.offsetHeight + "px";
 	canvas.style.width = container.offsetWidth + "px";
 
 	var ctx = canvas.getContext("2d");
-	if (myChart) {
+	if(myChart){
 		myChart.destroy();
 	}
 	myChart = new Chart(ctx, {
@@ -279,9 +270,9 @@ var lineOverlay = overlayControl.addOverlay(function (container) {
 			layout: {
 				padding: getScalePaddings(values)
 			},
-			onResize: function (chart, newSize) {
+			onResize: function(chart, newSize) {
 				var dataRange = gantt.getSubtaskDates();
-				if (dataRange.start_date) {
+				if(dataRange.start_date){
 					// align chart with the scale range
 					chart.options.layout.padding = getScalePaddings(values);
 				}
@@ -293,7 +284,7 @@ var lineOverlay = overlayControl.addOverlay(function (container) {
 				mode: "index",
 				intersect: false,
 				callbacks: {
-					label: function (tooltipItem, data) {
+					label: function(tooltipItem, data) {
 						var dataset = data.datasets[tooltipItem.datasetIndex];
 						return dataset.label + ": " + dataset.data[tooltipItem.index] + "%";
 					}
@@ -306,28 +297,28 @@ var lineOverlay = overlayControl.addOverlay(function (container) {
 			scales: {
 				xAxes: [{
 					labels: scaleLabels,
-					gridLines: {
+					gridLines:{
 						display: false
 					},
 					ticks: {
 						display: false
 					}
 				},
-				{
+					{
-					position: "top",
+						position:"top",
-					labels: scaleLabels,
+						labels: scaleLabels,
-					gridLines: {
+						gridLines:{
-						display: false
+							display: false
-					},
+						},
-					ticks: {
+						ticks: {
-						display: false
+							display: false
+						}
 					}
-				}
 				],
 				yAxes: [{
 					display: true,
 					gridLines: {
-						display: false
+						display:false
 					},
 					ticks: {
 						display: true,