From 585d60776ffb6a871e76f3244f7bf716f7dbdf1a Mon Sep 17 00:00:00 2001 From: Jae Sung Park Date: Mon, 20 May 2019 17:16:07 +0900 Subject: [PATCH] fix(zoom): Fix zoom rescale by wheel Add 'orgXScale' state to be used for re-scale on zooming Fix #890 --- .travis.yml | 3 -- spec/interactions/zoom-spec.js | 68 ++++++++++++++++++++++++++++++++-- src/interactions/zoom.js | 11 +++++- 3 files changed, 74 insertions(+), 8 deletions(-) diff --git a/.travis.yml b/.travis.yml index 4fe18559a..a314a95d3 100644 --- a/.travis.yml +++ b/.travis.yml @@ -6,7 +6,6 @@ sudo: false # no need for virtualization. before_install: - npm install -g npm@latest - npm install -g greenkeeper-lockfile@1 - - "curl -H 'Cache-Control: no-cache' https://raw.githubusercontent.com/fossas/fossa-cli/master/install.sh | sudo bash" install: - npm install sudo: required @@ -21,8 +20,6 @@ before_script: - npm run lint script: - npm run coverage - - fossa init - - fossa analyze after_script: - greenkeeper-lockfile-upload after_success: diff --git a/spec/interactions/zoom-spec.js b/spec/interactions/zoom-spec.js index 73dbcf0d0..9d330639e 100644 --- a/spec/interactions/zoom-spec.js +++ b/spec/interactions/zoom-spec.js @@ -225,8 +225,70 @@ describe("ZOOM", function() { chart.unzoom(); // zoom set to initial expect(subX.domain()).to.be.deep.equal(chart.internal.x.orgDomain()); // subX value not updated on zoom in }); + }); - }); + describe("zoom wheel", () => { + before(() => { + args = { + size: { + width: 300, + height: 250 + }, + data: { + columns: [ + ["data1", 30, 200, 100, 400, 3150, 250], + ["data2", 50, 20, 10, 40, 15, 6025] + ] + }, + zoom: { + rescale: true, + enabled: true + } + }; + }); + + it("check with rescale option", () => { + const eventRect = chart.$.main.select(".bb-event-rect-2").node(); + const orgDomain = { + x: chart.internal.x.domain(), + y: chart.internal.y.domain() + }; + + // when zoom in + util.fireEvent(eventRect, "wheel", { + deltaX: 0, + deltaY: -100, + clientX: 159, + clientY: 137 + }); + + ["x", "y"].forEach(id => { + const domain = orgDomain[id]; + + expect( + chart.internal[id].domain() + .every((v, i) => i > 0 ? v < domain[i] : v > domain[i]) + ).to.be.true; + }); + + // when zoom out + util.fireEvent(eventRect, "wheel", { + deltaX: 0, + deltaY: 100, + clientX: 159, + clientY: 137 + }); + + ["x", "y"].forEach(id => { + const domain = orgDomain[id]; + + expect( + chart.internal[id].domain() + .every((v, i) => v === domain[i]) + ).to.be.true; + }); + }); + }); describe("zoom type drag", () => { let clickedData; @@ -359,7 +421,7 @@ describe("ZOOM", function() { }, chart); expect(clickedData).to.not.be.undefined; - }); + }); }); describe("zoom on regions", () => { @@ -543,7 +605,7 @@ describe("ZOOM", function() { chart.zoom([new Date("01-01-2016 00:00"), new Date("02-01-2016 00:00")]); const expected = ["Jan 03", "Jan 10", "Jan 17", "Jan 24", "Jan 31"]; - + chart.$.main.selectAll(selector).each(function(d, i) { expect(this.textContent).to.be.equal(expected[i]); }); diff --git a/src/interactions/zoom.js b/src/interactions/zoom.js index 4dae84c02..ed5944b63 100644 --- a/src/interactions/zoom.js +++ b/src/interactions/zoom.js @@ -86,8 +86,11 @@ extend(ChartInternal.prototype, { * @private */ zoom.updateTransformScale = transform => { + // in case of resize, update range of orgXScale + $$.orgXScale && $$.orgXScale.range($$.x.range()); + // rescale from the original scale - const newScale = transform.rescaleX($$.x); + const newScale = transform.rescaleX($$.orgXScale || $$.x); const domain = $$.trimXDomain(newScale.domain()); const rescale = config.zoom_rescale; @@ -96,7 +99,11 @@ extend(ChartInternal.prototype, { $$.zoomScale = $$.getCustomizedScale(newScale); $$.xAxis.scale($$.zoomScale); - rescale && $$.x.domain($$.zoomScale.orgDomain()); + if (rescale) { + // copy current initial x scale in case of rescale option is used + !$$.orgXScale && ($$.orgXScale = $$.x.copy()); + $$.x.domain(domain); + } }; $$.zoom = zoom;