fix: ignore local timezones when creating a heatmap

src/js/charts/Heatmap.js

@@ -2,7 +2,7 @@ import BaseChart from './BaseChart';
 import { getComponent } from '../objects/ChartComponents';
 import { makeText, heatSquare } from '../utils/draw';
 import {
-	DAY_NAMES_SHORT, addDays, areInSameMonth, getLastDateInMonth, setDayToSunday, getYyyyMmDd, getWeeksBetween, getMonthName, clone,
+	DAY_NAMES_SHORT, toMidnightUTC, addDays, areInSameMonth, getLastDateInMonth, setDayToSunday, getYyyyMmDd, getWeeksBetween, getMonthName, clone,
 	NO_OF_MILLIS, NO_OF_YEAR_MONTHS, NO_OF_DAYS_IN_WEEK
 } from '../utils/date-utils';
 import { calcDistribution, getMaxCheckpoint } from '../utils/intervals';
@@ -62,7 +62,12 @@ export default class Heatmap extends BaseChart {
 			data.start = new Date();
 			data.start.setFullYear(data.start.getFullYear() - 1);
 		}
-		if (!data.end) { data.end = new Date(); }
+		data.start = toMidnightUTC(data.start);
+
+		if (!data.end) {
+			data.end = new Date();
+		}
+		data.end = toMidnightUTC(data.end);
 		data.dataPoints = data.dataPoints || {};
 
 		if (parseInt(Object.keys(data.dataPoints)[0]) > 100000) {
@@ -234,7 +239,7 @@ export default class Heatmap extends BaseChart {
 	getDomainConfig(startDate, endDate = '') {
 		let [month, year] = [startDate.getMonth(), startDate.getFullYear()];
 		let startOfWeek = setDayToSunday(startDate); // TODO: Monday as well
-		endDate = clone(endDate) || getLastDateInMonth(month, year);
+		endDate = endDate ? clone(endDate) : toMidnightUTC(getLastDateInMonth(month, year));
 
 		let domainConfig = {
 			index: month,
@@ -249,7 +254,7 @@ export default class Heatmap extends BaseChart {
 			col = this.getCol(startOfWeek, month);
 			cols.push(col);
 
-			startOfWeek = new Date(col[NO_OF_DAYS_IN_WEEK - 1].yyyyMmDd);
+			startOfWeek = toMidnightUTC(new Date(col[NO_OF_DAYS_IN_WEEK - 1].yyyyMmDd));
 			addDays(startOfWeek, 1);
 		}
 

src/js/utils/axis-chart-utils.js

@@ -39,7 +39,7 @@ export function dataPrep(data, type) {
 
 		// Set type
 		if (!d.chartType) {
-			if (!AXIS_DATASET_CHART_TYPES.includes(type)) type === DEFAULT_AXIS_CHART_TYPE;
+			if (!AXIS_DATASET_CHART_TYPES.includes(type)) type = DEFAULT_AXIS_CHART_TYPE;
 			d.chartType = type;
 		}
 

src/js/utils/date-utils.js

@@ -22,6 +22,12 @@ function treatAsUtc(date) {
 	return result;
 }
 
+export function toMidnightUTC(date) {
+	let result = new Date(date);
+	result.setUTCHours(0, result.getTimezoneOffset(), 0, 0);
+	return result;
+}
+
 export function getYyyyMmDd(date) {
 	let dd = date.getDate();
 	let mm = date.getMonth() + 1; // getMonth() is zero-based

src/js/utils/helpers.js

@@ -14,10 +14,10 @@ export function floatTwo(d) {
  * @param {Array} arr2 Second array
  */
 export function arraysEqual(arr1, arr2) {
-	if(arr1.length !== arr2.length) return false;
+	if (arr1.length !== arr2.length) return false;
 	let areEqual = true;
 	arr1.map((d, i) => {
-		if(arr2[i] !== d) areEqual = false;
+		if (arr2[i] !== d) areEqual = false;
 	});
 	return areEqual;
 }
@@ -46,8 +46,8 @@ export function shuffle(array) {
  * @param {Object} element element to fill with
  * @param {Boolean} start fill at start?
  */
-export function fillArray(array, count, element, start=false) {
-	if(!element) {
+export function fillArray(array, count, element, start = false) {
+	if (!element) {
 		element = start ? array[0] : array[array.length - 1];
 	}
 	let fillerArray = new Array(Math.abs(count)).fill(element);
@@ -61,16 +61,16 @@ export function fillArray(array, count, element, start=false) {
  * @param {Number} charWidth Width of single char in pixels
  */
 export function getStringWidth(string, charWidth) {
-	return (string+"").length * charWidth;
+	return (string + "").length * charWidth;
 }
 
 export function bindChange(obj, getFn, setFn) {
 	return new Proxy(obj, {
-		set: function(target, prop, value) {
+		set: function (target, prop, value) {
 			setFn();
 			return Reflect.set(target, prop, value);
 		},
-		get: function(target, prop) {
+		get: function (target, prop) {
 			getFn();
 			return Reflect.get(target, prop);
 		}
@@ -98,7 +98,7 @@ export function getPositionByAngle(angle, radius) {
  * @param {object} candidate Candidate to test
  * @param {Boolean} nonNegative flag to treat negative number as invalid
  */
-export function isValidNumber(candidate, nonNegative=false) {
+export function isValidNumber(candidate, nonNegative = false) {
 	if (Number.isNaN(candidate)) return false;
 	else if (candidate === undefined) return false;
 	else if (!Number.isFinite(candidate)) return false;
@@ -120,24 +120,24 @@ export function round(d) {
  * Creates a deep clone of an object
  * @param {Object} candidate Any Object
  */
- export function deepClone(candidate) {
+export function deepClone(candidate) {
 	let cloned, value, key;
-  
+
 	if (candidate instanceof Date) {
-	  return new Date(candidate.getTime());
+		return new Date(candidate.getTime());
 	}
-  
+
 	if (typeof candidate !== "object" || candidate === null) {
-	  return candidate;
+		return candidate;
 	}
-  
+
 	cloned = Array.isArray(candidate) ? [] : {};
-  
+
 	for (key in candidate) {
-	  value = candidate[key];
-  
-	  cloned[key] = deepClone(value);
+		value = candidate[key];
+
+		cloned[key] = deepClone(value);
 	}
-  
+
 	return cloned;
-  }
+}

src/js/utils/intervals.js

@@ -85,7 +85,7 @@ export function calcChartIntervals(values, withMinimum = false, range = {}) {
 	if (range.max !== undefined) {
 		maxValue = maxValue > range.max ? maxValue : range.max;
 	}
-	
+
 	if (range.min !== undefined) {
 		minValue = minValue < range.min ? minValue : range.min;
 	}
@@ -160,7 +160,7 @@ export function calcChartIntervals(values, withMinimum = false, range = {}) {
 		intervals = intervals.reverse().map(d => d * (-1));
 	}
 
-	return intervals;
+	return intervals.sort((a, b) => (a - b));
 }
 
 export function getZeroIndex(yPts) {