diff --git a/src/graph_renderer.ts b/src/graph_renderer.ts index dff5bdc..51bc9a7 100644 --- a/src/graph_renderer.ts +++ b/src/graph_renderer.ts @@ -480,6 +480,7 @@ export class GraphRenderer { } private _addTimeAxis(minTimeStep: number) { + let format; let min = this._timeMin; let max = this._timeMax; @@ -493,8 +494,12 @@ export class GraphRenderer { if(generatedTicks.length !== 0) { console.log('Time format'); console.log('Ticks amount: ', generatedTicks.length); - - const format = this._timeFormat(generatedTicks, min, max); + if(this.panel.xaxis.customDateFormatShow) { + format = this.panel.xaxis.customDateFormat; + } else { + format = this._timeFormat(generatedTicks, min, max); + } + const formatDate = ($.plot as any).formatDate; ticks = _.map(generatedTicks, tick => { const secondsInMinute = 60; diff --git a/src/module.ts b/src/module.ts index 1c413b9..9d15f7b 100644 --- a/src/module.ts +++ b/src/module.ts @@ -62,6 +62,8 @@ class GraphCtrl extends MetricsPanelCtrl { name: null, values: [], buckets: null, + customDateFormatShow: false, + customDateFormat: '' }, // show/hide lines lines: true, diff --git a/src/partials/axes_editor.html b/src/partials/axes_editor.html index 6160ef0..12caa1f 100644 --- a/src/partials/axes_editor.html +++ b/src/partials/axes_editor.html @@ -43,14 +43,46 @@
+Use the input field above to override x-axis time-date display to suit your needs. +List of supported variables: + %a: weekday name + %b: month name + %d: day of month, zero-padded (01-31) + %e: day of month, space-padded ( 1-31) + %H: hours, 24-hour time, zero-padded (00-23) + %I: hours, 12-hour time, zero-padded (01-12) + %m: month, zero-padded (01-12) + %M: minutes, zero-padded (00-59) + %q: quarter (1-4) + %S: seconds, zero-padded (00-59) + %y: year (two digits) + %Y: year (four digits) + %p: am/pm + %P: AM/PM (uppercase version of %p) + %w: weekday as number (0-6, 0 being Sunday) + +Examples: +"%d %b" = "2 Nov" +"DoW index: %w" = "DoW index: 1" +"%y; %m; %d" = "18; 10; 25" ++