From 1155c07bfe0892980a04f26c6de10f678d00030c Mon Sep 17 00:00:00 2001 From: Juned Chhipa Date: Sun, 23 Jun 2019 01:35:45 +0530 Subject: [PATCH] prevent cropped last xaxis label - fixes #305; fix wrong formatter function being applied for tooltips --- src/modules/Dimensions.js | 7 ++++- src/modules/Formatters.js | 58 +++++++++++++++++++---------------- src/modules/axes/AxesUtils.js | 3 +- src/modules/tooltip/Labels.js | 6 +++- 4 files changed, 44 insertions(+), 30 deletions(-) diff --git a/src/modules/Dimensions.js b/src/modules/Dimensions.js index 8f0b0de20..cc51cb2d5 100644 --- a/src/modules/Dimensions.js +++ b/src/modules/Dimensions.js @@ -322,6 +322,10 @@ export default class Dimensions { // we have to make it false again in case of zooming/panning w.globals.skipLastTimelinelabel = false } + } else if (w.config.xaxis.type === 'datetime') { + if (w.config.grid.padding.right < labels.width) { + w.globals.skipLastTimelinelabel = true + } } else if (w.config.xaxis.type !== 'datetime') { if (w.config.grid.padding.right < labels.width) { this.xPadRight = labels.width / 2 + 1 @@ -532,7 +536,8 @@ export default class Dimensions { } let xFormat = new Formatters(this.ctx) - val = xFormat.xLabelFormat(xlbFormatter, val) + let timestamp = val + val = xFormat.xLabelFormat(xlbFormatter, val, timestamp) let graphics = new Graphics(this.ctx) diff --git a/src/modules/Formatters.js b/src/modules/Formatters.js index e743aa315..a56070f6d 100644 --- a/src/modules/Formatters.js +++ b/src/modules/Formatters.js @@ -14,23 +14,25 @@ class Formatters { this.tooltipKeyFormat = 'dd MMM' } - xLabelFormat(fn, val) { + xLabelFormat(fn, val, timestamp) { let w = this.w if (w.config.xaxis.type === 'datetime') { - // if user has not specified a custom formatter, use the default tooltip.x.format - if (w.config.tooltip.x.formatter === undefined) { - let datetimeObj = new DateTime(this.ctx) - return datetimeObj.formatDate( - new Date(val), - w.config.tooltip.x.format, - true, - true - ) + if (w.config.xaxis.labels.formatter === undefined) { + // if user has not specified a custom formatter, use the default tooltip.x.format + if (w.config.tooltip.x.formatter === undefined) { + let datetimeObj = new DateTime(this.ctx) + return datetimeObj.formatDate( + new Date(val), + w.config.tooltip.x.format, + true, + true + ) + } } } - return fn(val) + return fn(val, timestamp) } setLabelFormatters() { @@ -56,8 +58,26 @@ class Formatters { return val } + // formatter function will always overwrite format property + if (w.config.xaxis.labels.formatter !== undefined) { + w.globals.xLabelFormatter = w.config.xaxis.labels.formatter + } else { + w.globals.xLabelFormatter = function(val) { + if (Utils.isNumber(val)) { + // numeric xaxis may have smaller range, so defaulting to 1 decimal + if (w.config.xaxis.type === 'numeric' && w.globals.dataPoints < 50) { + return val.toFixed(1) + } + return val.toFixed(0) + } + return val + } + } + if (typeof w.config.tooltip.x.formatter === 'function') { w.globals.ttKeyFormatter = w.config.tooltip.x.formatter + } else { + w.globals.ttKeyFormatter = w.globals.xLabelFormatter } if (typeof w.config.xaxis.tooltip.formatter === 'function') { @@ -81,22 +101,6 @@ class Formatters { w.globals.legendFormatter = w.config.legend.formatter } - // formatter function will always overwrite format property - if (w.config.xaxis.labels.formatter !== undefined) { - w.globals.xLabelFormatter = w.config.xaxis.labels.formatter - } else { - w.globals.xLabelFormatter = function(val) { - if (Utils.isNumber(val)) { - // numeric xaxis may have smaller range, so defaulting to 1 decimal - if (w.config.xaxis.type === 'numeric' && w.globals.dataPoints < 50) { - return val.toFixed(1) - } - return val.toFixed(0) - } - return val - } - } - // formatter function will always overwrite format property w.config.yaxis.forEach((yaxe, i) => { if (yaxe.labels.formatter !== undefined) { diff --git a/src/modules/axes/AxesUtils.js b/src/modules/axes/AxesUtils.js index 978f19558..116755251 100644 --- a/src/modules/axes/AxesUtils.js +++ b/src/modules/axes/AxesUtils.js @@ -17,7 +17,8 @@ export default class AxesUtils { let customFormatter = w.config.xaxis.labels.formatter let xFormat = new Formatters(this.ctx) - label = xFormat.xLabelFormat(xlbFormatter, rawLabel) + let timestamp = rawLabel + label = xFormat.xLabelFormat(xlbFormatter, rawLabel, timestamp) if (customFormatter !== undefined) { label = customFormatter(rawLabel, labels[i], i) diff --git a/src/modules/tooltip/Labels.js b/src/modules/tooltip/Labels.js index b56bce974..811aa0ee4 100644 --- a/src/modules/tooltip/Labels.js +++ b/src/modules/tooltip/Labels.js @@ -320,7 +320,11 @@ export default class Labels { if (w.globals.isXNumeric && w.config.xaxis.type === 'datetime') { let xFormat = new Formatters(this.ctx) - xVal = xFormat.xLabelFormat(w.globals.ttKeyFormatter, bufferXVal) + xVal = xFormat.xLabelFormat( + w.globals.ttKeyFormatter, + bufferXVal, + bufferXVal + ) } else { xVal = w.globals.xLabelFormatter(bufferXVal, customFormatterOpts) }