From fcd0808aeaa4a0554a8a2841228d733056c1cf25 Mon Sep 17 00:00:00 2001 From: Akihiko Kusanagi Date: Wed, 2 Jan 2019 23:00:55 +0800 Subject: [PATCH] Fix time scale ticks.reverse issue (#5933) --- src/controllers/controller.bar.js | 10 ++-- src/scales/scale.time.js | 32 ++++++------ .../bar-thickness-flex-single-reverse.json | 42 ++++++++++++++++ .../bar-thickness-flex-single-reverse.png | Bin 0 -> 2132 bytes .../bar-thickness-flex-single.json | 41 +++++++++++++++ .../bar-thickness-flex-single.png | Bin 0 -> 2132 bytes .../controller.bar/bar-thickness-reverse.json | 47 ++++++++++++++++++ .../controller.bar/bar-thickness-reverse.png | Bin 0 -> 2789 bytes test/specs/scale.time.tests.js | 21 +++++++- 9 files changed, 172 insertions(+), 21 deletions(-) create mode 100644 test/fixtures/controller.bar/bar-thickness-flex-single-reverse.json create mode 100644 test/fixtures/controller.bar/bar-thickness-flex-single-reverse.png create mode 100644 test/fixtures/controller.bar/bar-thickness-flex-single.json create mode 100644 test/fixtures/controller.bar/bar-thickness-flex-single.png create mode 100644 test/fixtures/controller.bar/bar-thickness-reverse.json create mode 100644 test/fixtures/controller.bar/bar-thickness-reverse.png diff --git a/src/controllers/controller.bar.js b/src/controllers/controller.bar.js index 41881600110..639350f71f2 100644 --- a/src/controllers/controller.bar.js +++ b/src/controllers/controller.bar.js @@ -37,7 +37,7 @@ function computeMinSampleSize(scale, pixels) { var prev, curr, i, ilen; for (i = 1, ilen = pixels.length; i < ilen; ++i) { - min = Math.min(min, pixels[i] - pixels[i - 1]); + min = Math.min(min, Math.abs(pixels[i] - pixels[i - 1])); } for (i = 0, ilen = ticks.length; i < ilen; ++i) { @@ -95,8 +95,8 @@ function computeFlexCategoryTraits(index, ruler, options) { if (prev === null) { // first data: its size is double based on the next point or, - // if it's also the last data, we use the scale end extremity. - prev = curr - (next === null ? ruler.end - curr : next - curr); + // if it's also the last data, we use the scale size. + prev = curr - (next === null ? ruler.end - ruler.start : next - curr); } if (next === null) { @@ -104,8 +104,8 @@ function computeFlexCategoryTraits(index, ruler, options) { next = curr + curr - prev; } - start = curr - ((curr - prev) / 2) * percent; - size = ((next - prev) / 2) * percent; + start = curr - (curr - Math.min(prev, next)) / 2 * percent; + size = Math.abs(next - prev) / 2 * percent; return { chunk: size / ruler.stackCount, diff --git a/src/scales/scale.time.js b/src/scales/scale.time.js index 099e5717e9a..3c698f57db0 100644 --- a/src/scales/scale.time.js +++ b/src/scales/scale.time.js @@ -356,34 +356,36 @@ function generate(min, max, capacity, options) { } /** - * Returns the end and start offsets from edges in the form of {start, end}. + * Returns the start and end offsets from edges in the form of {start, end} + * where each value is a relative width to the scale and ranges between 0 and 1. + * They add extra margins on the both sides by scaling down the original scale. * Offsets are added when the `offset` option is true. */ function computeOffsets(table, ticks, min, max, options) { var start = 0; var end = 0; - var upper, lower; + var first, last; if (options.offset && ticks.length) { if (!options.time.min) { - upper = ticks.length > 1 ? ticks[1] : max; - lower = ticks[0]; - start = ( - interpolate(table, 'time', upper, 'pos') - - interpolate(table, 'time', lower, 'pos') - ) / 2; + first = interpolate(table, 'time', ticks[0], 'pos'); + if (ticks.length === 1) { + start = 1 - first; + } else { + start = (interpolate(table, 'time', ticks[1], 'pos') - first) / 2; + } } if (!options.time.max) { - upper = ticks[ticks.length - 1]; - lower = ticks.length > 1 ? ticks[ticks.length - 2] : min; - end = ( - interpolate(table, 'time', upper, 'pos') - - interpolate(table, 'time', lower, 'pos') - ) / 2; + last = interpolate(table, 'time', ticks[ticks.length - 1], 'pos'); + if (ticks.length === 1) { + end = last; + } else { + end = (last - interpolate(table, 'time', ticks[ticks.length - 2], 'pos')) / 2; + } } } - return options.ticks.reverse ? {start: end, end: start} : {start: start, end: end}; + return {start: start, end: end}; } function ticksFromTimestamps(values, majorUnit) { diff --git a/test/fixtures/controller.bar/bar-thickness-flex-single-reverse.json b/test/fixtures/controller.bar/bar-thickness-flex-single-reverse.json new file mode 100644 index 00000000000..a220e537fc1 --- /dev/null +++ b/test/fixtures/controller.bar/bar-thickness-flex-single-reverse.json @@ -0,0 +1,42 @@ +{ + "config": { + "type": "bar", + "data": { + "labels": ["2016", "2018", "2020", "2024", "2030"], + "datasets": [{ + "backgroundColor": "#FF6384", + "data": [1] + }] + }, + "options": { + "responsive": false, + "legend": false, + "title": false, + "scales": { + "xAxes": [{ + "type": "time", + "display": false, + "barThickness": "flex", + "barPercentage": 1, + "categoryPercentage": 1, + "ticks": { + "source": "labels", + "reverse": true + } + }], + "yAxes": [{ + "display": false, + "ticks": { + "beginAtZero": true + } + }] + } + } + }, + "options": { + "canvas": { + "height": 256, + "width": 512 + } + } +} diff --git a/test/fixtures/controller.bar/bar-thickness-flex-single-reverse.png b/test/fixtures/controller.bar/bar-thickness-flex-single-reverse.png new file mode 100644 index 0000000000000000000000000000000000000000..25a19957b0a2c82c6efbf6cc4475fe09277e2db0 GIT binary patch literal 2132 zcmeAS@N?(olHy`uVBq!ia0y~yU;;83893O0)X@p&(is>yq&;06Ln`LHz2Ydypulrr zL*-GfeeFGV9`BPD8c*7ndp`Do|JQnz)~n1+R-^Q2IEyq&;06Ln`LHz2Ydypulrr zL*-GfeeFGV9`BPDZho%!Vfn-_`Cl6v{Qk;&CXUjh;V_yGM)SdFIWSrdjFtn#z8r|< ZcVN@b(OA_s5!hN_@O1TaS?83{1OTW$AzJ_d literal 0 HcmV?d00001 diff --git a/test/fixtures/controller.bar/bar-thickness-reverse.json b/test/fixtures/controller.bar/bar-thickness-reverse.json new file mode 100644 index 00000000000..72b335023be --- /dev/null +++ b/test/fixtures/controller.bar/bar-thickness-reverse.json @@ -0,0 +1,47 @@ +{ + "config": { + "type": "bar", + "data": { + "labels": ["2016", "2018", "2020", "2024", "2030"], + "datasets": [{ + "backgroundColor": "#FF6384", + "data": [1, null, 3, 4, 5] + }, { + "backgroundColor": "#36A2EB", + "data": [5, 4, 3, null, 1] + }, { + "backgroundColor": "#FFCE56", + "data": [3, 5, 2, null, 4] + }] + }, + "options": { + "responsive": false, + "legend": false, + "title": false, + "scales": { + "xAxes": [{ + "type": "time", + "display": false, + "barPercentage": 1, + "categoryPercentage": 1, + "ticks": { + "source": "labels", + "reverse": true + } + }], + "yAxes": [{ + "display": false, + "ticks": { + "beginAtZero": true + } + }] + } + } + }, + "options": { + "canvas": { + "height": 256, + "width": 512 + } + } +} diff --git a/test/fixtures/controller.bar/bar-thickness-reverse.png b/test/fixtures/controller.bar/bar-thickness-reverse.png new file mode 100644 index 0000000000000000000000000000000000000000..cf6d621cc551dd4d26819a6c673474c1fb00d373 GIT binary patch literal 2789 zcmeAS@N?(olHy`uVBq!ia0y~yU;;83893O0)X@p&(is@I)_A%&hE&XXdu{)zxsj5` z9#*i0$u+PiEL4l~TP)Y0rtru>jVri|N2$lPK&k1u!mK4itlV#vIm{;U{L6gClctuX zdShqqyniQ;-~+Icr+`}{qB<}*~VGBt3rFuZYQ_`<>nKx@ zVKf{dSsghXeE1vmZU4PkeEM@W|N33~YyWP(Uc=6`K%HR$2Sd;@_5;)9>wkRws=s}A z{LW|A&@y9!5(7&Eg9f-j(PVO9;Al`{nBl-MDm)q{EDUG~;=ne>4@Z~l-`{ca-{dHJ73uU|G3O=FTk+p9mFJ;Z;$2w z{+o6GV*UQ_oB3H7?g%kF;b34?U|?Zr1}0FTIRXq!4USN285j>JFg1vPq#GC#1Q;E< zK++Bj1|19vt_)y(5-!kmD!{;_#NZ(alICDw0~HPojHAX5