Skip to content

Scale gl3d error bars #74

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
Dec 4, 2015
Merged

Scale gl3d error bars #74

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
911796c
lint: gl-vis --> plotly.js
etpinard Dec 3, 2015
d074741
fix gl3d errorbar convert step:
etpinard Dec 3, 2015
dca44b9
update error bar width rescaling to match 2d
etpinard Dec 3, 2015
972461f
add two image tests
etpinard Dec 3, 2015
cda8431
improve 3d test image cases
etpinard Dec 4, 2015
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
116 changes: 59 additions & 57 deletions src/traces/scatter3d/calc_errors.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,95 +9,97 @@

'use strict';

function calculateAxisErrors(data, params) {
if(!params || !params.visible) {
return null;
}
function calculateAxisErrors(data, params, scaleFactor) {
if(!params || !params.visible) return null;

function option(name, value) {
if(name in params) {
return params[name];
}
if(name in params) return params[name];
return value;
}

var result = new Array(data.length);
var type = option('type', 'percent');
var symmetric = option('symmetric', true);
var value = +option('value', 10);
var minusValue = +option('valueminus', 10);
var error = option('array', null);
var minusError = option('arrayminus', null);
var x, h, l, r, i;
var result = new Array(data.length),
type = option('type', 'percent'),
symmetric = option('symmetric', true),
value = +option('value', 10),
minusValue = +option('valueminus', 10),
error = option('array', null),
minusError = option('arrayminus', null);

if(symmetric) {
minusValue = value;
minusError = error;
}

if(type === 'data' && (!error || !minusError)) {
return null;
}
if(type === 'data' && (!error || !minusError)) return null;

for(var i = 0; i < data.length; i++) {
var x = +data[i];

for(i=0; i<data.length; ++i) {
x = +data[i];
switch(type) {
case 'percent':
h = Math.abs(x) * value / 100.0;
l = Math.abs(x) * minusValue / 100.0;
result[i] = [ -l, h ];
break;

case 'constant':
result[i] = [ -minusValue, value ];
break;

case 'sqrt':
r = Math.sqrt(Math.abs(x));
result[i] = [ -r, r ];
break;

case 'data':
result[i] = [ (+minusError[i]) - x, (+error[i]) - x ];
break;
case 'percent':
result[i] = [
-Math.abs(x) * (minusValue / 100.0) * scaleFactor,
Math.abs(x) * (value / 100.0) * scaleFactor
];
break;

case 'constant':
result[i] = [
-minusValue * scaleFactor,
value * scaleFactor
];
break;

case 'sqrt':
var r = Math.sqrt(Math.abs(x)) * scaleFactor;
result[i] = [-r, r];
break;

case 'data':
result[i] = [
-(+minusError[i]) * scaleFactor,
(+error[i]) * scaleFactor
];
break;
}
}

return result;
}

function dataLength(array) {
for(var i=0; i<array.length; ++i) {
if(array[i]) {
return array[i].length;
}
for(var i = 0; i < array.length; i++) {
if(array[i]) return array[i].length;
}
return 0;
}

function calculateErrors(data) {
function calculateErrors(data, scaleFactor) {
var errors = [
calculateAxisErrors(data.x, data.error_x),
calculateAxisErrors(data.y, data.error_y),
calculateAxisErrors(data.z, data.error_z) ],
errorBounds,
n = dataLength(errors),
i, j, k, bound;
if(n === 0) {
return null;
}
errorBounds = new Array(n);
for(i=0; i<n; ++i) {
bound = [[0,0,0],[0,0,0]];
for(j=0; j<3; ++j) {
calculateAxisErrors(data.x, data.error_x, scaleFactor[0]),
calculateAxisErrors(data.y, data.error_y, scaleFactor[1]),
calculateAxisErrors(data.z, data.error_z, scaleFactor[2])
];

var n = dataLength(errors);
if(n === 0) return null;

var errorBounds = new Array(n);

for(var i = 0; i < n; i++) {
var bound = [[0,0,0], [0,0,0]];

for(var j = 0; j < 3; j++) {
if(errors[j]) {
for(k=0; k<2; ++k) {
for(var k = 0; k < 2; k++) {
bound[k][j] = errors[j][i][k];
}
}
}

errorBounds[i] = bound;
}

return errorBounds;
}

Expand Down
34 changes: 19 additions & 15 deletions src/traces/scatter3d/convert.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,20 +106,23 @@ function constructDelaunay(points, color, axis) {

function calculateErrorParams(errors) {
/*jshint camelcase: false */
var capSize = [0.0, 0.0, 0.0], i, e;
var color = [[0,0,0],[0,0,0],[0,0,0]];
var lineWidth = [0.0, 0.0, 0.0];
for(i=0; i<3; ++i) {
e = errors[i];
if (e && e.copy_zstyle !== false) {
e = errors[2];
}

var capSize = [0.0, 0.0, 0.0],
color = [[0,0,0], [0,0,0], [0,0,0]],
lineWidth = [0.0, 0.0, 0.0];

for(var i = 0; i < 3; i++) {
var e = errors[i];

if(e && e.copy_zstyle !== false) e = errors[2];
if(!e) continue;
capSize[i] = e.width / 100.0; //Ballpark rescaling, attempt to make consistent with plot.ly

capSize[i] = e.width / 2; // ballpark rescaling
color[i] = str2RgbaArray(e.color);
lineWidth = e.thickness;

}

return {capSize: capSize, color: color, lineWidth: lineWidth};
}

Expand Down Expand Up @@ -173,7 +176,6 @@ function convertPlotlyOptions(scene, data) {
zaxis = sceneLayout.zaxis,
marker = data.marker,
line = data.line,
errorParams = calculateErrorParams([ data.error_x, data.error_y, data.error_z ]),
xc, x = data.x || [],
yc, y = data.y || [],
zc, z = data.z || [],
Expand Down Expand Up @@ -241,13 +243,15 @@ function convertPlotlyOptions(scene, data) {
}
}

params.errorBounds = calculateError(data);
params.errorColor = errorParams.color;
params.errorBounds = calculateError(data, scaleFactor);

var errorParams = calculateErrorParams([data.error_x, data.error_y, data.error_z]);
params.errorColor = errorParams.color;
params.errorLineWidth = errorParams.lineWidth;
params.errorCapSize = errorParams.capSize;
params.errorCapSize = errorParams.capSize;

params.delaunayAxis = data.surfaceaxis;
params.delaunayColor = str2RgbaArray(data.surfacecolor);
params.delaunayAxis = data.surfaceaxis;
params.delaunayColor = str2RgbaArray(data.surfacecolor);

return params;
}
Expand Down
Binary file added test/image/baselines/gl3d_errorbars_zx.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added test/image/baselines/gl3d_errorbars_zy.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
65 changes: 65 additions & 0 deletions test/image/mocks/gl3d_errorbars_zx.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
{
"data": [
{
"type": "scatter3d",
"mode": "markers",
"x": [
1,
2,
3
],
"y": [
1,
2,
3
],
"z": [
2000,
1000,
2000
],
"error_z": {
"array": [
1000,
500,
1000
],
"arrayminus": [
0,
500,
0
],
"color": "green",
"thinkness": 5
Copy link
Collaborator

Choose a reason for hiding this comment

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

I don't "think" that's what you meant

Copy link
Contributor Author

Choose a reason for hiding this comment

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

haha good catch. Thanks.

},
"error_x": {
"type": "constant",
"value": 0.1,
"color": "black"
},
"marker": {
"symbol": "square"
},
"uid": "0c6e64"
}
],
"layout": {
"scene": {
"camera": {
"eye": {
"x": 0.2,
"y": 3.5,
"z": 0.4
}
},
"aspectratio": {
"x": 2,
"y": 2,
"z": 1
}
},
"height": 450,
"width": 1000,
"autosize": true
}
}
53 changes: 53 additions & 0 deletions test/image/mocks/gl3d_errorbars_zy.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
{
"data": [
{
"type": "scatter3d",
"x": [
1,
2,
3
],
"y": [
1,
2,
3
],
"z": [
200,
100,
200
],
"error_z": {
"type": "percent",
"value": 20,
"color": "red",
"width": 0.5
Copy link
Collaborator

Choose a reason for hiding this comment

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

This is sposed to add caps, right? Want to make it bigger so we can see them and verify that they end up looking similar to caps that size on 2D svg error bars?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

sure. my mistake

},
"error_y": {
"type": "constant",
"value": 0.25,
"valueminus": 0.1
},
"uid": "a8f51d"
}
],
"layout": {
"scene": {
"camera": {
"eye": {
"x": 3,
"y": 0.2,
"z": 0.2
}
},
"aspectratio": {
"x": 2,
"y": 2,
"z": 1
}
},
"height": 450,
"width": 1000,
"autosize": true
}
}