|
|
@ -67,26 +67,26 @@ function getSCurveData() { |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
function toggleOverlay() { |
|
|
|
function toggleOverlay() { |
|
|
|
if(overlayControl.isOverlayVisible(lineOverlay)){ |
|
|
|
if (overlayControl.isOverlayVisible(lineOverlay)) { |
|
|
|
gantt.config.readonly = false; |
|
|
|
gantt.config.readonly = false; |
|
|
|
overlayControl.hideOverlay(lineOverlay); |
|
|
|
overlayControl.hideOverlay(lineOverlay); |
|
|
|
gantt.$root.classList.remove("overlay_visible"); |
|
|
|
gantt.$root.classList.remove("overlay_visible"); |
|
|
|
}else{ |
|
|
|
} else { |
|
|
|
gantt.config.readonly = true; |
|
|
|
gantt.config.readonly = true; |
|
|
|
overlayControl.showOverlay(lineOverlay); |
|
|
|
overlayControl.showOverlay(lineOverlay); |
|
|
|
gantt.$root.classList.add("overlay_visible"); |
|
|
|
gantt.$root.classList.add("overlay_visible"); |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function getChartScaleRange(){ |
|
|
|
function getChartScaleRange() { |
|
|
|
var tasksRange = gantt.getSubtaskDates(); |
|
|
|
var tasksRange = gantt.getSubtaskDates(); |
|
|
|
var cells = []; |
|
|
|
var cells = []; |
|
|
|
var scale = gantt.getScale(); |
|
|
|
var scale = gantt.getScale(); |
|
|
|
if(!tasksRange.start_date){ |
|
|
|
if (!tasksRange.start_date) { |
|
|
|
return scale.trace_x; |
|
|
|
return scale.trace_x; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
scale.trace_x.forEach(function(date){ |
|
|
|
scale.trace_x.forEach(function (date) { |
|
|
|
// if(date >= tasksRange.start_date && date <= tasksRange.end_date){
|
|
|
|
// if(date >= tasksRange.start_date && date <= tasksRange.end_date){
|
|
|
|
// cells.push(date);
|
|
|
|
// cells.push(date);
|
|
|
|
// }
|
|
|
|
// }
|
|
|
@ -128,12 +128,16 @@ function getProgressLine() { |
|
|
|
realDurations = cumulativeRealDurations; |
|
|
|
realDurations = cumulativeRealDurations; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
if (Math.floor(maxReal) > 100 || Math.floor(maxPlan) > 100) { |
|
|
|
if (Math.floor(maxReal) > 110 || Math.floor(maxPlan) > 110) { |
|
|
|
plannedDurations = plannedDurations.map((item) => { |
|
|
|
plannedDurations = plannedDurations.map((item) => { |
|
|
|
return item/maxPlan*100; |
|
|
|
return item / maxPlan * 100; |
|
|
|
}) |
|
|
|
}) |
|
|
|
realDurations = realDurations.map((item) => { |
|
|
|
realDurations = realDurations.map((item) => { |
|
|
|
return item/maxReal*100; |
|
|
|
if (maxPlan >= 200) { |
|
|
|
|
|
|
|
return item / maxPlan * 100; |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
return item / maxReal * 100; |
|
|
|
|
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
@ -176,14 +180,14 @@ function adjustDataToZoom(dates, data, chartScaleRange, zoomLevel) { |
|
|
|
}; |
|
|
|
}; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function getScalePaddings(values){ |
|
|
|
function getScalePaddings(values) { |
|
|
|
let zoom = gantt.ext.zoom.getCurrentLevel(); |
|
|
|
let zoom = gantt.ext.zoom.getCurrentLevel(); |
|
|
|
var scale = gantt.getScale(); |
|
|
|
var scale = gantt.getScale(); |
|
|
|
var dataRange = gantt.getSubtaskDates(); |
|
|
|
var dataRange = gantt.getSubtaskDates(); |
|
|
|
// let minDate = new Date();
|
|
|
|
// let minDate = new Date();
|
|
|
|
// let maxDate = new Date();
|
|
|
|
// let maxDate = new Date();
|
|
|
|
let minValueDate = new Date(values.dates[0]); |
|
|
|
let minValueDate = new Date(values.dates[0]); |
|
|
|
let maxValueDate = new Date(values.dates[values.dates.length -1]); |
|
|
|
let maxValueDate = new Date(values.dates[values.dates.length - 1]); |
|
|
|
|
|
|
|
|
|
|
|
// gantt.eachTask(function(task){
|
|
|
|
// gantt.eachTask(function(task){
|
|
|
|
// let plannedEarlier = task.planned_start < task.start_date;
|
|
|
|
// let plannedEarlier = task.planned_start < task.start_date;
|
|
|
@ -203,11 +207,11 @@ function getScalePaddings(values){ |
|
|
|
// })
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
|
|
var padding = { |
|
|
|
var padding = { |
|
|
|
left:0, |
|
|
|
left: 0, |
|
|
|
right:0 |
|
|
|
right: 0 |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
if(dataRange.start_date){ |
|
|
|
if (dataRange.start_date) { |
|
|
|
var yScaleLabelsWidth = 48; |
|
|
|
var yScaleLabelsWidth = 48; |
|
|
|
// fine tune values in order to align chart with the scale range
|
|
|
|
// fine tune values in order to align chart with the scale range
|
|
|
|
padding.left = gantt.posFromDate(minValueDate); |
|
|
|
padding.left = gantt.posFromDate(minValueDate); |
|
|
@ -219,23 +223,23 @@ function getScalePaddings(values){ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
var myChart; |
|
|
|
var myChart; |
|
|
|
var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
var lineOverlay = overlayControl.addOverlay(function (container) { |
|
|
|
var values = getProgressLine(); |
|
|
|
var values = getProgressLine(); |
|
|
|
var scaleLabels = []; |
|
|
|
var scaleLabels = []; |
|
|
|
|
|
|
|
|
|
|
|
// if(parts[2] && parts[2] == '1'){
|
|
|
|
// if(parts[2] && parts[2] == '1'){
|
|
|
|
// values.dates.forEach(function(date){
|
|
|
|
// values.dates.forEach(function(date){
|
|
|
|
// var dateScale = new Date(date);
|
|
|
|
// var dateScale = new Date(date);
|
|
|
|
// scaleLabels.push(dateToStr(dateScale));
|
|
|
|
// scaleLabels.push(dateToStr(dateScale));
|
|
|
|
// })
|
|
|
|
// })
|
|
|
|
// } else {
|
|
|
|
// } else {
|
|
|
|
// var chartScale = getChartScaleRange();
|
|
|
|
// var chartScale = getChartScaleRange();
|
|
|
|
|
|
|
|
|
|
|
|
// chartScale.forEach(function(date){
|
|
|
|
// chartScale.forEach(function(date){
|
|
|
|
// scaleLabels.push(dateToStr(date));
|
|
|
|
// scaleLabels.push(dateToStr(date));
|
|
|
|
// });
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
// }
|
|
|
|
values.dates.forEach(function(date){ |
|
|
|
values.dates.forEach(function (date) { |
|
|
|
var dateScale = new Date(date); |
|
|
|
var dateScale = new Date(date); |
|
|
|
scaleLabels.push(dateToStr(dateScale)); |
|
|
|
scaleLabels.push(dateToStr(dateScale)); |
|
|
|
}) |
|
|
|
}) |
|
|
@ -245,7 +249,7 @@ var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
canvas.style.width = container.offsetWidth + "px"; |
|
|
|
canvas.style.width = container.offsetWidth + "px"; |
|
|
|
|
|
|
|
|
|
|
|
var ctx = canvas.getContext("2d"); |
|
|
|
var ctx = canvas.getContext("2d"); |
|
|
|
if(myChart){ |
|
|
|
if (myChart) { |
|
|
|
myChart.destroy(); |
|
|
|
myChart.destroy(); |
|
|
|
} |
|
|
|
} |
|
|
|
myChart = new Chart(ctx, { |
|
|
|
myChart = new Chart(ctx, { |
|
|
@ -276,9 +280,9 @@ var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
layout: { |
|
|
|
layout: { |
|
|
|
padding: getScalePaddings(values) |
|
|
|
padding: getScalePaddings(values) |
|
|
|
}, |
|
|
|
}, |
|
|
|
onResize: function(chart, newSize) { |
|
|
|
onResize: function (chart, newSize) { |
|
|
|
var dataRange = gantt.getSubtaskDates(); |
|
|
|
var dataRange = gantt.getSubtaskDates(); |
|
|
|
if(dataRange.start_date){ |
|
|
|
if (dataRange.start_date) { |
|
|
|
// align chart with the scale range
|
|
|
|
// align chart with the scale range
|
|
|
|
chart.options.layout.padding = getScalePaddings(values); |
|
|
|
chart.options.layout.padding = getScalePaddings(values); |
|
|
|
} |
|
|
|
} |
|
|
@ -290,7 +294,7 @@ var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
mode: "index", |
|
|
|
mode: "index", |
|
|
|
intersect: false, |
|
|
|
intersect: false, |
|
|
|
callbacks: { |
|
|
|
callbacks: { |
|
|
|
label: function(tooltipItem, data) { |
|
|
|
label: function (tooltipItem, data) { |
|
|
|
var dataset = data.datasets[tooltipItem.datasetIndex]; |
|
|
|
var dataset = data.datasets[tooltipItem.datasetIndex]; |
|
|
|
return dataset.label + ": " + dataset.data[tooltipItem.index] + "%"; |
|
|
|
return dataset.label + ": " + dataset.data[tooltipItem.index] + "%"; |
|
|
|
} |
|
|
|
} |
|
|
@ -303,7 +307,7 @@ var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
scales: { |
|
|
|
scales: { |
|
|
|
xAxes: [{ |
|
|
|
xAxes: [{ |
|
|
|
labels: scaleLabels, |
|
|
|
labels: scaleLabels, |
|
|
|
gridLines:{ |
|
|
|
gridLines: { |
|
|
|
display: false |
|
|
|
display: false |
|
|
|
}, |
|
|
|
}, |
|
|
|
ticks: { |
|
|
|
ticks: { |
|
|
@ -311,9 +315,9 @@ var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
position:"top", |
|
|
|
position: "top", |
|
|
|
labels: scaleLabels, |
|
|
|
labels: scaleLabels, |
|
|
|
gridLines:{ |
|
|
|
gridLines: { |
|
|
|
display: false |
|
|
|
display: false |
|
|
|
}, |
|
|
|
}, |
|
|
|
ticks: { |
|
|
|
ticks: { |
|
|
@ -324,7 +328,7 @@ var lineOverlay = overlayControl.addOverlay(function(container) { |
|
|
|
yAxes: [{ |
|
|
|
yAxes: [{ |
|
|
|
display: true, |
|
|
|
display: true, |
|
|
|
gridLines: { |
|
|
|
gridLines: { |
|
|
|
display:false |
|
|
|
display: false |
|
|
|
}, |
|
|
|
}, |
|
|
|
ticks: { |
|
|
|
ticks: { |
|
|
|
display: true, |
|
|
|
display: true, |
|
|
|