Skip to content

Modebar date zoom fix #1162

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Nov 17, 2016
Merged

Modebar date zoom fix #1162

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
d7de2ae
issue #1160 fix
adamborowski Nov 17, 2016
665e56c
modebar: use axis r21 and l2r to compute zoom +/- ranges
etpinard Nov 17, 2016
8e9d458
test: test all cartesian axis types in modebar click cases
etpinard Nov 17, 2016
c45338d
test: use ax.r2l to assert range
etpinard Nov 17, 2016
f1b686f
test: assert up to yyyy-mm-dd for date ranges
etpinard Nov 17, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 12 additions & 3 deletions src/components/modebar/buttons.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -204,9 +204,18 @@ function handleCartesian(gd, ev) {
}
}
else {
var rangeNow = ax.range;
aobj[axName + '.range[0]'] = r0 * rangeNow[0] + r1 * rangeNow[1];
aobj[axName + '.range[1]'] = r0 * rangeNow[1] + r1 * rangeNow[0];
var rangeNow = [
ax.r2l(ax.range[0]),
ax.r2l(ax.range[1]),
];

var rangeNew = [
r0 * rangeNow[0] + r1 * rangeNow[1],
r0 * rangeNow[1] + r1 * rangeNow[0]
];

aobj[axName + '.range[0]'] = ax.l2r(rangeNew[0]);
aobj[axName + '.range[1]'] = ax.l2r(rangeNew[1]);
}
}
}
Expand Down
69 changes: 43 additions & 26 deletions test/jasmine/tests/modebar_test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ var d3 = require('d3');

var createModeBar = require('@src/components/modebar/modebar');
var manageModeBar = require('@src/components/modebar/manage');
var customMatchers = require('../assets/custom_matchers');

var Plotly = require('@lib/index');
var Plots = require('@src/plots/plots');
Expand Down Expand Up @@ -613,12 +614,25 @@ describe('ModeBar', function() {
describe('modebar on clicks', function() {
var gd, modeBar;

beforeAll(function() {
jasmine.addMatchers(customMatchers);
});

afterEach(destroyGraphDiv);

function assertRange(actual, expected) {
function assertRange(axName, expected) {
var PRECISION = 2;
expect(actual[0]).toBeCloseTo(expected[0], PRECISION);
expect(actual[1]).toBeCloseTo(expected[1], PRECISION);

var ax = gd._fullLayout[axName];
var actual = ax.range;

if(ax.type === 'date') {
var truncate = function(v) { return v.substr(0, 10); };
expect(actual.map(truncate)).toEqual(expected.map(truncate), axName);
}
else {
expect(actual).toBeCloseToArray(expected, PRECISION, axName);
}
}

function assertActive(buttons, activeButton) {
Expand All @@ -634,9 +648,11 @@ describe('ModeBar', function() {
beforeEach(function(done) {
var mockData = [{
type: 'scatter',
y: [2, 1, 2]
x: ['2016-01-01', '2016-02-01', '2016-03-01'],
y: [10, 100, 1000],
}, {
type: 'bar',
x: ['a', 'b', 'c'],
y: [2, 1, 2],
xaxis: 'x2',
yaxis: 'y2'
Expand All @@ -646,11 +662,12 @@ describe('ModeBar', function() {
xaxis: {
anchor: 'y',
domain: [0, 0.5],
range: [0, 5]
range: ['2016-01-01', '2016-04-01']
},
yaxis: {
anchor: 'x',
range: [0, 3]
type: 'log',
range: [1, 3]
},
xaxis2: {
anchor: 'y2',
Expand Down Expand Up @@ -679,35 +696,35 @@ describe('ModeBar', function() {
buttonAutoScale = selectButton(modeBar, 'autoScale2d'),
buttonResetScale = selectButton(modeBar, 'resetScale2d');

assertRange(gd._fullLayout.xaxis.range, [0, 5]);
assertRange(gd._fullLayout.yaxis.range, [0, 3]);
assertRange(gd._fullLayout.xaxis2.range, [-1, 4]);
assertRange(gd._fullLayout.yaxis2.range, [0, 4]);
assertRange('xaxis', ['2016-01-01', '2016-04-01']);
assertRange('yaxis', [1, 3]);
assertRange('xaxis2', [-1, 4]);
assertRange('yaxis2', [0, 4]);

buttonZoomIn.click();
assertRange(gd._fullLayout.xaxis.range, [1.25, 3.75]);
assertRange(gd._fullLayout.yaxis.range, [0.75, 2.25]);
assertRange(gd._fullLayout.xaxis2.range, [0.25, 2.75]);
assertRange(gd._fullLayout.yaxis2.range, [1, 3]);
assertRange('xaxis', ['2016-01-23 17:45', '2016-03-09 05:15']);
assertRange('yaxis', [1.5, 2.5]);
assertRange('xaxis2', [0.25, 2.75]);
assertRange('yaxis2', [1, 3]);

buttonZoomOut.click();
assertRange(gd._fullLayout.xaxis.range, [0, 5]);
assertRange(gd._fullLayout.yaxis.range, [0, 3]);
assertRange(gd._fullLayout.xaxis2.range, [-1, 4]);
assertRange(gd._fullLayout.yaxis2.range, [0, 4]);
assertRange('xaxis', ['2016-01-01', '2016-04-01']);
assertRange('yaxis', [1, 3]);
assertRange('xaxis2', [-1, 4]);
assertRange('yaxis2', [0, 4]);

buttonZoomIn.click();
buttonAutoScale.click();
assertRange(gd._fullLayout.xaxis.range, [-0.1584327, 2.1584327]);
assertRange(gd._fullLayout.yaxis.range, [0.92675159, 2.073248]);
assertRange(gd._fullLayout.xaxis2.range, [-0.5, 2.5]);
assertRange(gd._fullLayout.yaxis2.range, [0, 2.105263]);
assertRange('xaxis', ['2015-12-27 06:36:39.6661', '2016-03-05 17:23:20.3339']);
assertRange('yaxis', [0.8591, 3.1408]);
assertRange('xaxis2', [-0.5, 2.5]);
assertRange('yaxis2', [0, 2.105263]);

buttonResetScale.click();
assertRange(gd._fullLayout.xaxis.range, [0, 5]);
assertRange(gd._fullLayout.yaxis.range, [0, 3]);
assertRange(gd._fullLayout.xaxis2.range, [-1, 4]);
assertRange(gd._fullLayout.yaxis2.range, [0, 4]);
assertRange('xaxis', ['2016-01-01', '2016-04-01']);
assertRange('yaxis', [1, 3]);
assertRange('xaxis2', [-1, 4]);
assertRange('yaxis2', [0, 4]);
});
});

Expand Down