diff --git a/view-mode/function/overlaySCurve.js b/view-mode/function/overlaySCurve.js index e030a87..426a410 100644 --- a/view-mode/function/overlaySCurve.js +++ b/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 - padding.left = gantt.posFromDate(minValueDate); - padding.right = scale.full_width - gantt.posFromDate(maxValueDate); + let monthDifference = calculateMonthDifference(minValueDate, maxValueDate); + if(monthDifference >= 0 && monthDifference <= 3) { + 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.dates.forEach(function(date){ - // 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)); - }) + values.planned = values.planned.map(value => +(Math.round(value + "e+2") + "e-2")); + values.real = values.real.map(value => +(Math.round(value + "e+2") + "e-2")); + 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", - labels: scaleLabels, - gridLines: { - display: false - }, - ticks: { - display: false + { + position:"top", + labels: scaleLabels, + gridLines:{ + display: false + }, + ticks: { + display: false + } } - } ], yAxes: [{ display: true, gridLines: { - display: false + display:false }, ticks: { display: true,