diff --git a/CHANGELOG.md b/CHANGELOG.md index 519f0d38f..649afa683 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ ## v1.2.0 [unreleased] ### Bug Fixes + 1. [#882](https://github.com/influxdata/chronograf/pull/882): Fix y-axis graph padding ### Features 1. [#873](https://github.com/influxdata/chronograf/pull/873): Add [TLS](https://github.com/influxdata/chronograf/blob/master/docs/tls.md) support diff --git a/ui/spec/shared/parsing/getRangeForDygraphSpec.js b/ui/spec/shared/parsing/getRangeForDygraphSpec.js index a65fef9f2..8c9ebe0a7 100644 --- a/ui/spec/shared/parsing/getRangeForDygraphSpec.js +++ b/ui/spec/shared/parsing/getRangeForDygraphSpec.js @@ -40,4 +40,48 @@ describe('getRangeForDygraphSpec', () => { expect(actual).to.deep.equal(expected); }); + + describe('when user provides a rule value', () => { + const defaultMax = 20; + const defaultMin = -10; + const timeSeries = [[new Date(1000), defaultMax], [new Date(2000), 1], [new Date(3000), defaultMin]]; + + it('can pad positive values', () => { + const value = 20; + const [min, max] = getRange(timeSeries, undefined, value); + + expect(min).to.equal(defaultMin); + expect(max).to.be.above(defaultMax); + }); + + it('can pad negative values', () => { + const value = -10; + const [min, max] = getRange(timeSeries, undefined, value); + + expect(min).to.be.below(defaultMin); + expect(max).to.equal(defaultMax); + }); + }); + + describe('when user provides a rule range value', () => { + const defaultMax = 20; + const defaultMin = -10; + const timeSeries = [[new Date(1000), defaultMax], [new Date(2000), 1], [new Date(3000), defaultMin]]; + + it('can pad positive values', () => { + const rangeValue = 20; + const [min, max] = getRange(timeSeries, undefined, 0, rangeValue); + + expect(min).to.equal(defaultMin); + expect(max).to.be.above(defaultMax); + }); + + it('can pad negative values', () => { + const rangeValue = -10; + const [min, max] = getRange(timeSeries, undefined, 0, rangeValue); + + expect(min).to.be.below(defaultMin); + expect(max).to.equal(defaultMax); + }); + }); }); diff --git a/ui/src/shared/parsing/getRangeForDygraph.js b/ui/src/shared/parsing/getRangeForDygraph.js index 204cfda90..16e5a5ceb 100644 --- a/ui/src/shared/parsing/getRangeForDygraph.js +++ b/ui/src/shared/parsing/getRangeForDygraph.js @@ -5,25 +5,21 @@ export default function getRange(timeSeries, override, value = null, rangeValue return override; } - const subtractPadding = (val) => +val - val * PADDING_FACTOR; - const addPadding = (val) => +val + val * PADDING_FACTOR; + const subtractPadding = (val) => +val - Math.abs(val * PADDING_FACTOR); + const addPadding = (val) => +val + Math.abs(val * PADDING_FACTOR); - const pad = (val, side) => { + const pad = (val) => { if (val === null || val === '') { return null; } - if (val < 0) { - return side === "top" ? subtractPadding(val) : addPadding(val); - } - - return side === "top" ? addPadding(val) : subtractPadding(val); + return val < 0 ? subtractPadding(val) : addPadding(val); }; const points = [ ...timeSeries, [null, pad(value)], - [null, pad(rangeValue, "top")], + [null, pad(rangeValue)], ]; const range = points.reduce(([min, max] = [], series) => {