mirror of
https://github.com/ConnectedHumber/Air-Quality-Web
synced 2024-11-22 06:23:01 +00:00
Bugfix: Correct dynamic adjustment of x axis labels on device graph
This commit is contained in:
parent
74d8d6ee87
commit
850060a6c0
2 changed files with 17 additions and 2 deletions
|
@ -12,6 +12,7 @@ import Chart from '../../node_modules/chart.js/dist/Chart.bundle.min.js';
|
||||||
import GetFromUrl from './Helpers/GetFromUrl.mjs';
|
import GetFromUrl from './Helpers/GetFromUrl.mjs';
|
||||||
import GetContainingElement from './Helpers/GetContainingElement.mjs';
|
import GetContainingElement from './Helpers/GetContainingElement.mjs';
|
||||||
import Postify from './Helpers/Postify.mjs';
|
import Postify from './Helpers/Postify.mjs';
|
||||||
|
import { human_duration_unit } from './Helpers/DateHelper.mjs';
|
||||||
|
|
||||||
|
|
||||||
class DeviceReadingDisplay {
|
class DeviceReadingDisplay {
|
||||||
|
@ -238,7 +239,7 @@ class DeviceReadingDisplay {
|
||||||
type: "time",
|
type: "time",
|
||||||
time: {
|
time: {
|
||||||
format: "YYYY-MM-DD HH:mm",
|
format: "YYYY-MM-DD HH:mm",
|
||||||
tooltipFormat: 'll HH:mm'
|
tooltipFormat: 'll HH:mm',
|
||||||
},
|
},
|
||||||
scaleLabel: {
|
scaleLabel: {
|
||||||
display: true,
|
display: true,
|
||||||
|
@ -354,7 +355,8 @@ class DeviceReadingDisplay {
|
||||||
|
|
||||||
// Update the x axis labels
|
// Update the x axis labels
|
||||||
// this.chart.data.labels = new_data_obj.data.map((point) => point.t);
|
// this.chart.data.labels = new_data_obj.data.map((point) => point.t);
|
||||||
|
this.chart.options.scales.xAxes[0].time.unit = human_duration_unit(this.end_time.diff(this.start_time));
|
||||||
|
console.log(`New unit: ${this.chart.options.scales.xAxes[0].time.unit}`);
|
||||||
// Update the chart
|
// Update the chart
|
||||||
this.chart.update();
|
this.chart.update();
|
||||||
|
|
||||||
|
|
13
client_src/js/Helpers/DateHelper.mjs
Normal file
13
client_src/js/Helpers/DateHelper.mjs
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
function human_duration_unit(milliseconds) {
|
||||||
|
let seconds = Math.floor(milliseconds / 1000);
|
||||||
|
if(seconds <= 60) return "second";
|
||||||
|
if(seconds <= 60*60) return "minute";
|
||||||
|
if(seconds <= 60*60*24) return "hour";
|
||||||
|
if(seconds <= 60*60*24*45) return "day";
|
||||||
|
if(seconds <= 60*60*24*365) return "month";
|
||||||
|
return "year";
|
||||||
|
}
|
||||||
|
|
||||||
|
export { human_duration_unit };
|
Loading…
Reference in a new issue