|
@ -7,20 +7,30 @@ require("highcharts/modules/accessibility")(Highcharts) |
|
|
require("highcharts/modules/exporting")(Highcharts) |
|
|
require("highcharts/modules/exporting")(Highcharts) |
|
|
require("highcharts/modules/export-data")(Highcharts) |
|
|
require("highcharts/modules/export-data")(Highcharts) |
|
|
|
|
|
|
|
|
|
|
|
var timeSum = 0; |
|
|
|
|
|
var timeAverage = 0; |
|
|
|
|
|
|
|
|
export default function TotalAreaChart() { |
|
|
export default function TotalAreaChart() { |
|
|
const chartComponent = useRef(null) |
|
|
const chartComponent = useRef(null) |
|
|
var chartOptions = getOptions() |
|
|
var chartOptions = getOptions() |
|
|
return ( |
|
|
return ( |
|
|
|
|
|
<div> |
|
|
<HighchartsReact |
|
|
<HighchartsReact |
|
|
ref={chartComponent} |
|
|
ref={chartComponent} |
|
|
highcharts={Highcharts} |
|
|
highcharts={Highcharts} |
|
|
options={chartOptions} |
|
|
options={chartOptions} |
|
|
/> |
|
|
/> |
|
|
|
|
|
<br /> |
|
|
|
|
|
<p><b>Total time spent: </b>{timeSum}h</p> |
|
|
|
|
|
<p><b>Average time spent per day: </b>{timeAverage}h</p> |
|
|
|
|
|
</div> |
|
|
) |
|
|
) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function getOptions() { |
|
|
function getOptions() { |
|
|
var projectDataMap = [] |
|
|
var projectDataMap = [] |
|
|
|
|
|
timeSum = 0; |
|
|
|
|
|
timeAverage = 0; |
|
|
var entryExtremes = getLowestAndHighestDates(fileContent) |
|
|
var entryExtremes = getLowestAndHighestDates(fileContent) |
|
|
var lowestStartDate = entryExtremes.lDate |
|
|
var lowestStartDate = entryExtremes.lDate |
|
|
var highestStartDate = entryExtremes.hDate |
|
|
var highestStartDate = entryExtremes.hDate |
|
@ -58,6 +68,11 @@ function getOptions() { |
|
|
itDate = new Date(itDate.valueOf() + 3600 * 1000 * 24) |
|
|
itDate = new Date(itDate.valueOf() + 3600 * 1000 * 24) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
timeSum = projectDataMap.reduce(add, 0); |
|
|
|
|
|
timeAverage = timeSum / projectDataMap.length; |
|
|
|
|
|
timeSum = roundTo(timeSum, 2); |
|
|
|
|
|
timeAverage = roundTo(timeAverage, 2); |
|
|
|
|
|
|
|
|
// Convert accumulated data into HighCharts Series Object |
|
|
// Convert accumulated data into HighCharts Series Object |
|
|
const highChartsSeries = { |
|
|
const highChartsSeries = { |
|
|
name: "Total hours spent", |
|
|
name: "Total hours spent", |
|
@ -101,6 +116,28 @@ function getOptions() { |
|
|
return highchartsOptions |
|
|
return highchartsOptions |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function add(accumulator, a) { |
|
|
|
|
|
return accumulator + a; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
function roundTo(n, digits) { |
|
|
|
|
|
var negative = false; |
|
|
|
|
|
if (digits === undefined) { |
|
|
|
|
|
digits = 0; |
|
|
|
|
|
} |
|
|
|
|
|
if (n < 0) { |
|
|
|
|
|
negative = true; |
|
|
|
|
|
n = n * -1; |
|
|
|
|
|
} |
|
|
|
|
|
var multiplicator = Math.pow(10, digits); |
|
|
|
|
|
n = parseFloat((n * multiplicator).toFixed(11)); |
|
|
|
|
|
n = (Math.round(n) / multiplicator).toFixed(digits); |
|
|
|
|
|
if (negative) { |
|
|
|
|
|
n = (n * -1).toFixed(digits); |
|
|
|
|
|
} |
|
|
|
|
|
return n; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
function getLowestAndHighestDates(entries) { |
|
|
function getLowestAndHighestDates(entries) { |
|
|
var lowestDate = new Date() |
|
|
var lowestDate = new Date() |
|
|
var highestDate = new Date(1970, 1, 1) |
|
|
var highestDate = new Date(1970, 1, 1) |
|
|