Skip to content
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.

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

sort categorical Cartesian axes by value #3864

Merged
merged 13 commits into from
May 17, 2019
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
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
6 changes: 4 additions & 2 deletions src/plots/cartesian/layout_attributes.js
Original file line number Diff line number Diff line change
Expand Up @@ -821,7 +821,9 @@ module.exports = {
'value ascending', 'value descending',
'min ascending', 'min descending',
'max ascending', 'max descending',
'sum ascending', 'sum descending'
'sum ascending', 'sum descending',
'mean ascending', 'mean descending',
'median ascending', 'median descending'
],
dflt: 'trace',
role: 'info',
Expand All @@ -836,7 +838,7 @@ module.exports = {
'the *trace* mode. The unspecified categories will follow the categories in `categoryarray`.',
'Set `categoryorder` to *value ascending* or *value descending* if order should be determined by the',
'numerical order of the values.',
'Similarly, the order can be determined by the min, max or the sums of the values.'
'Similarly, the order can be determined by the min, max, sum, mean or media of all the values.'
].join(' ')
},
categoryarray: {
Expand Down
34 changes: 16 additions & 18 deletions src/plots/plots.js
Original file line number Diff line number Diff line change
Expand Up @@ -2856,7 +2856,7 @@ plots.doCalcdata = function(gd, traces) {
Registry.getComponentMethod('errorbars', 'calc')(gd);
};

var sortAxisCategoriesByValueRegex = /(value|sum|min|max) (ascending|descending)/;
var sortAxisCategoriesByValueRegex = /(value|sum|min|max|mean|median) (ascending|descending)/;

function sortAxisCategoriesByValue(axList, gd) {
var affectedTraces = [];
Expand All @@ -2876,8 +2876,7 @@ function sortAxisCategoriesByValue(axList, gd) {
if(xCategorical && o === value[l].length - 1) return -1;
if(yCategorical && l === value.length - 1) return -1;

var catIndex = axLetter === 'y' ? l : o;
return catIndex - 1;
return (axLetter === 'y' ? l : o) - 1;
};
} else {
return function(o, l) {
Expand All @@ -2886,13 +2885,25 @@ function sortAxisCategoriesByValue(axList, gd) {
}
}

var aggFn = {
'min': function(values) {return Lib.aggNums(Math.min, null, values);},
'max': function(values) {return Lib.aggNums(Math.max, null, values);},
'sum': function(values) {return Lib.aggNums(function(a, b) { return a + b;}, null, values);},
'value': function(values) {return Lib.aggNums(function(a, b) { return a + b;}, null, values);},
etpinard marked this conversation as resolved.
Show resolved Hide resolved
'mean': function(values) {return Lib.mean(values);},
'median': function(values) {values.sort(); var mid = Math.round((values.length - 1) / 2); return values[mid];}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm surprised our linter didn't complain here. Would you mind rewriting this as

'median': function(values) {
    values.sort(); 
    var mid = Math.round((values.length - 1) / 2); 
    return values[mid];
}

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's probably an eslint rule for this 🔬

};

for(i = 0; i < axList.length; i++) {
var ax = axList[i];
if(ax.type !== 'category') continue;

// Order by value
var match = ax.categoryorder.match(sortAxisCategoriesByValueRegex);
etpinard marked this conversation as resolved.
Show resolved Hide resolved
if(match) {
var aggregator = match[1];
var order = match[2];

// Store values associated with each category
var categoriesValue = [];
for(j = 0; j < ax._categories.length; j++) {
Expand Down Expand Up @@ -2991,26 +3002,13 @@ function sortAxisCategoriesByValue(axList, gd) {
}
}

// Aggregate values
var aggFn;
switch(match[1]) {
case 'min':
aggFn = Math.min;
break;
case 'max':
aggFn = Math.max;
break;
default:
aggFn = function(a, b) { return a + b;};
}

ax._categoriesValue = categoriesValue;

var categoriesAggregatedValue = [];
for(j = 0; j < categoriesValue.length; j++) {
categoriesAggregatedValue.push([
categoriesValue[j][0],
Lib.aggNums(aggFn, null, categoriesValue[j][1])
aggFn[aggregator](categoriesValue[j][1])
]);
}

Expand All @@ -3027,7 +3025,7 @@ function sortAxisCategoriesByValue(axList, gd) {
});

// Reverse if descending
if(match[2] === 'descending') {
if(order === 'descending') {
ax._initialCategories.reverse();
}

Expand Down
48 changes: 41 additions & 7 deletions test/jasmine/tests/calcdata_test.js
Original file line number Diff line number Diff line change
Expand Up @@ -896,7 +896,7 @@ describe('calculated data and points', function() {
// oneOrientationTraces are traces for which swapping x/y is not supported
var oneOrientationTraces = ['ohlc', 'candlestick'];

function makeData(type, a, b, axName) {
function makeData(type, axName, a, b) {
var input = [a, b];
var cat = input[axName === 'yaxis' ? 1 : 0];
var data = input[axName === 'yaxis' ? 0 : 1];
Expand Down Expand Up @@ -939,6 +939,10 @@ describe('calculated data and points', function() {
high: data,
low: data,

// For histogram
nbinsx: cat.length,
nbinsy: data.length,

// For waterfall
measure: measure,

Expand Down Expand Up @@ -988,7 +992,7 @@ describe('calculated data and points', function() {
['value ascending', 'value descending'].forEach(function(categoryorder) {
it('sorts ' + axName + ' by ' + categoryorder + ' for trace type ' + trace.type, function(done) {
var data = [7, 2, 3];
var baseMock = {data: [makeData(trace.type, cat, data, axName)], layout: {}};
var baseMock = {data: [makeData(trace.type, axName, cat, data)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: categoryorder};

// Set expectations
Expand All @@ -1007,7 +1011,7 @@ describe('calculated data and points', function() {
var type = trace.type;
var data = [7, 2, 3];
var data2 = [5, 4, 2];
var baseMock = { data: [makeData(type, cat, data, axName), makeData(type, cat, data2, axName)], layout: {}};
var baseMock = { data: [makeData(type, axName, cat, data), makeData(type, axName, cat, data2)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: 'value ascending'};

var expectedAgg = [['a', data[0] + data2[0]], ['b', data[1] + data2[1]], ['c', data[2] + data2[2]]];
Expand All @@ -1021,7 +1025,7 @@ describe('calculated data and points', function() {
var type = trace.type;
var data = [7, 2, 3];
var data2 = [5, 4, 2];
var baseMock = { data: [makeData(type, cat, data, axName), makeData(type, cat, data2, axName)], layout: {}};
var baseMock = { data: [makeData(type, axName, cat, data), makeData(type, axName, cat, data2)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: 'value ascending'};

// Hide second trace
Expand All @@ -1037,7 +1041,7 @@ describe('calculated data and points', function() {
var type = trace.type;
var data = [7, 2, 3];
var data2 = [5, 4, 2];
var baseMock = { data: [makeData(type, cat, data, axName), makeData(type, cat, data2, axName)], layout: {}};
var baseMock = { data: [makeData(type, axName, cat, data), makeData(type, axName, cat, data2)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: 'min ascending'};

var expectedAgg = [['a', Math.min(data[0], data2[0])], ['b', Math.min(data[1], data2[1])], ['c', Math.min(data[2], data2[2])]];
Expand All @@ -1051,15 +1055,45 @@ describe('calculated data and points', function() {
var type = trace.type;
var data = [7, 2, 3];
var data2 = [5, 4, 2];
var baseMock = { data: [makeData(type, cat, data, axName), makeData(type, cat, data2, axName)], layout: {}};
var baseMock = { data: [makeData(type, axName, cat, data), makeData(type, axName, cat, data2)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: 'max ascending'};

var expectedAgg = [['a', Math.max(data[0], data2[0])], ['b', Math.max(data[1], data2[1])], ['c', Math.max(data[2], data2[2])]];
if(type === 'ohlc' || type === 'candlestick') expectedAgg = [['a', expectedAgg[0][1]], ['b', expectedAgg[1][1]], ['c', expectedAgg[2][1]]];
if(type.match(/histogram/)) expectedAgg = [['a', 2], ['b', 1], ['c', 1]];

checkAggregatedValue(baseMock, expectedAgg, false, done);
});

it('take the mean of all values per category across traces of type ' + trace.type, function(done) {
var type = trace.type;
var data = [7, 2, 3];
var data2 = [5, 4, 2];
var baseMock = { data: [makeData(type, axName, cat, data), makeData(type, axName, cat, data2)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: 'mean ascending'};

var expectedAgg = [['a', (data[0] + data2[0]) / 2 ], ['b', (data[1] + data2[1]) / 2], ['c', (data[2] + data2[2]) / 2]];
if(type === 'histogram') expectedAgg = [['a', 2], ['b', 1], ['c', 1]];
if(type === 'histogram2d') expectedAgg = [['a', 2 / 3], ['b', 1 / 3], ['c', 1 / 3]];
if(type === 'contour' || type === 'heatmap') expectedAgg = [['a', expectedAgg[0][1] / 3], ['b', expectedAgg[1][1] / 3], ['c', expectedAgg[2][1] / 3]];
if(type === 'histogram2dcontour') expectedAgg = [['a', 2 / 4], ['b', 1 / 4], ['c', 1 / 4]]; // TODO: this result is inintuitive

checkAggregatedValue(baseMock, expectedAgg, false, done);
});

it('take the median of all values per category across traces of type ' + trace.type, function(done) {
var type = trace.type;
var data = [7, 2, 3];
var data2 = [5, 4, 2];
var data3 = [6, 5, 7];
var baseMock = { data: [makeData(type, axName, cat, data), makeData(type, axName, cat, data2), makeData(type, axName, cat, data3)], layout: {}};
baseMock.layout[axName] = { type: 'category', categoryorder: 'median ascending'};

var expectedAgg = [['a', 6], ['b', 4], ['c', 3]];
if(type === 'histogram') expectedAgg = [['a', 2], ['b', 1], ['c', 1]];
if(type === 'histogram2d') expectedAgg = [['a', 1], ['b', 0], ['c', 0]];
if(type === 'histogram2dcontour' || type === 'contour' || type === 'heatmap') expectedAgg = [['a', 0], ['b', 0], ['c', 0]];
checkAggregatedValue(baseMock, expectedAgg, false, done);
});
});
});
});
Expand Down