Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit d4e0b68

Browse filesBrowse files
antoinergantoinerg
committed
initial support for z(min|max)
1 parent 3487b63 commit d4e0b68
Copy full SHA for d4e0b68

File tree

Expand file treeCollapse file tree

6 files changed

+108
-25
lines changed
Filter options
Expand file treeCollapse file tree

6 files changed

+108
-25
lines changed

‎src/traces/image/attributes.js

Copy file name to clipboardExpand all lines: src/traces/image/attributes.js
+15-3Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,20 +16,32 @@ module.exports = extendFlat({
1616
valType: 'data_array',
1717
role: 'info',
1818
editType: 'calc',
19-
description: 'Values from 0 to 255'
19+
description: 'A 2-dimensional array where each element is a color represented by 3 or 4 numbers in an array.'
20+
},
21+
zmin: {
22+
valType: 'data_array',
23+
role: 'info',
24+
editType: 'calc',
25+
description: 'Lower bound of colors in z' // TODO
26+
},
27+
zmax: {
28+
valType: 'data_array',
29+
role: 'info',
30+
editType: 'calc',
31+
description: 'Higher bound of colors in z' // TODO
2032
},
2133
x0: {
2234
valType: 'number',
2335
dflt: 0,
2436
role: 'info',
25-
editType: 'calc',
37+
editType: 'plot',
2638
description: 'Set the image\'s x position'
2739
},
2840
y0: {
2941
valType: 'number',
3042
dflt: 0,
3143
role: 'info',
32-
editType: 'calc',
44+
editType: 'plot',
3345
description: 'Set the image\'s y position'
3446
},
3547
dx: {

‎src/traces/image/constants.js

Copy file name to clipboard
+27Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
/**
2+
* Copyright 2012-2019, Plotly, Inc.
3+
* All rights reserved.
4+
*
5+
* This source code is licensed under the MIT license found in the
6+
* LICENSE file in the root directory of this source tree.
7+
*/
8+
9+
10+
'use strict';
11+
12+
module.exports = {
13+
colormodel: {
14+
'rgb': [[0, 0, 0], [255, 255, 255], function(c) {return c.slice(0, 3);}],
15+
'rgba': [[0, 0, 0, 0], [255, 255, 255, 1], function(c) {return c.slice(0, 4);}],
16+
'hsl': [[0, 0, 0], [360, 100, 100], function(c) {
17+
c[1] = c[1] + '%';
18+
c[2] = c[2] + '%';
19+
return c.slice(0, 3);
20+
}],
21+
'hsla': [[0, 0, 0, 0], [360, 100, 100, 1], function(c) {
22+
c[1] = c[1] + '%';
23+
c[2] = c[2] + '%';
24+
return c.slice(0, 4);
25+
}]
26+
}
27+
};

‎src/traces/image/defaults.js

Copy file name to clipboardExpand all lines: src/traces/image/defaults.js
+4Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111

1212
var Lib = require('../../lib');
1313
var attributes = require('./attributes');
14+
var constants = require('./constants');
1415

1516
module.exports = function supplyDefaults(traceIn, traceOut) {
1617
function coerce(attr, dflt) {
@@ -22,6 +23,9 @@ module.exports = function supplyDefaults(traceIn, traceOut) {
2223
coerce('dy');
2324
coerce('z');
2425
coerce('colormodel');
26+
27+
coerce('zmin', constants.colormodel[traceOut.colormodel][0]);
28+
coerce('zmax', constants.colormodel[traceOut.colormodel][1]);
2529
var dims = traceOut.colormodel.length;
2630
var dfltHovertemplate = '<span style="text-transform:uppercase">%{colormodel}</span>: [%{z[0]}, %{z[1]}, %{z[2]}' + (dims === 4 ? ', %{z[3]}' : '') + ']';
2731
coerce('hovertemplate', dfltHovertemplate);

‎src/traces/image/plot.js

Copy file name to clipboardExpand all lines: src/traces/image/plot.js
+37-18Lines changed: 37 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
var d3 = require('d3');
1111
var Lib = require('../../lib');
1212
var xmlnsNamespaces = require('../../constants/xmlns_namespaces');
13+
var constants = require('./constants');
1314

1415
module.exports = function(gd, plotinfo, cdimage, imageLayer) {
1516
var xa = plotinfo.xaxis;
@@ -70,10 +71,28 @@ module.exports = function(gd, plotinfo, cdimage, imageLayer) {
7071
var context = canvas.getContext('2d');
7172
var ipx = function(i) {return Lib.constrain(Math.round(xa.c2p(x0 + i * dx) - left), 0, imageWidth);};
7273
var jpx = function(j) {return Lib.constrain(Math.round(ya.c2p(y0 + j * dy) - top), 0, imageHeight);};
74+
75+
// Check which channel needs to be scaled
76+
var cr = constants.colormodel[trace.colormodel];
77+
var scale = [];
78+
var k;
79+
for(k = 0; k < tupleLength; k++) {
80+
if(cr[0][k] !== trace.zmin[k] || cr[1][k] !== trace.zmax[k]) {
81+
scale.push([k, (cr[1][k] - cr[0][k]) / (trace.zmax[k] - trace.zmin[k])]);
82+
}
83+
}
84+
7385
// TODO: for performance, when image size is reduced, only loop over pixels of interest
86+
var c = []; var ch;
7487
for(var i = 0; i < cd0.w; i++) {
7588
for(var j = 0; j < cd0.h; j++) {
76-
context.fillStyle = trace.colormodel + '(' + z[j][i].slice(0, tupleLength).join(',') + ')';
89+
c = z[j][i];
90+
for(k = 0; k < scale.length; k++) {
91+
ch = scale[k][0];
92+
c[ch] = (c[ch] - trace.zmin[ch]) * scale[k][1];
93+
c[ch] = Lib.constrain(c[ch], cr[0][k], cr[1][k]);
94+
}
95+
context.fillStyle = trace.colormodel + '(' + cr[2](c).join(',') + ')';
7796
context.fillRect(ipx(i), jpx(j), ipx(i + 1) - ipx(i), jpx(j + 1) - jpx(j));
7897
}
7998
}
@@ -86,23 +105,6 @@ module.exports = function(gd, plotinfo, cdimage, imageLayer) {
86105
preserveAspectRatio: 'none'
87106
});
88107

89-
// var canvas = document.createElement('canvas');
90-
// canvas.width = cd0.w;
91-
// canvas.height = cd0.h;
92-
// var context = canvas.getContext('2d');
93-
// for(var i = 0; i < cd0.w; i++) {
94-
// for(var j = 0; j < cd0.h; j++) {
95-
// context.fillStyle = trace.colormodel + '(' + z[j][i].slice(0, tupleLength).join(',') + ')';
96-
// context.fillRect(i, j, 1, 1);
97-
// }
98-
// }
99-
//
100-
// TODO: support additional smoothing options
101-
// https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering
102-
// http://phrogz.net/tmp/canvas_image_zoom.html
103-
// image3
104-
// .attr('style', 'image-rendering: optimizeSpeed; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast; image-rendering: optimize-contrast; image-rendering: crisp-edges; image-rendering: pixelated;');
105-
106108
image3.attr({
107109
height: imageHeight,
108110
width: imageWidth,
@@ -112,3 +114,20 @@ module.exports = function(gd, plotinfo, cdimage, imageLayer) {
112114
});
113115
});
114116
};
117+
118+
// var canvas = document.createElement('canvas');
119+
// canvas.width = cd0.w;
120+
// canvas.height = cd0.h;
121+
// var context = canvas.getContext('2d');
122+
// for(var i = 0; i < cd0.w; i++) {
123+
// for(var j = 0; j < cd0.h; j++) {
124+
// context.fillStyle = trace.colormodel + '(' + z[j][i].slice(0, tupleLength).join(',') + ')';
125+
// context.fillRect(i, j, 1, 1);
126+
// }
127+
// }
128+
//
129+
// TODO: support additional smoothing options
130+
// https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering
131+
// http://phrogz.net/tmp/canvas_image_zoom.html
132+
// image3
133+
// .attr('style', 'image-rendering: optimizeSpeed; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast; image-rendering: optimize-contrast; image-rendering: crisp-edges; image-rendering: pixelated;');

‎test/image/mocks/image_colormodel.json

Copy file name to clipboardExpand all lines: test/image/mocks/image_colormodel.json
+4-4Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@
99
"type": "image",
1010
"colormodel": "hsl",
1111
"z": [
12-
[[0, "33%", "50%"], [0, "66%", "50%"], [0, "100%", "50%"]],
13-
[[90, "33%", "50%"], [90, "66%", "50%"], [90, "100%", "50%"]],
14-
[[180, "33%", "50%"], [180, "66%", "50%"], [180, "100%", "50%"]],
15-
[[270, "33%", "50%"], [270, "66%", "50%"], [270, "100%", "50%"]]
12+
[[0, 33, 50], [0, 66, 50], [0, 100, 50]],
13+
[[90, 33, 50], [90, 66, 50], [90, 100, 50]],
14+
[[180, 33, 50], [180, 66, 50], [180, 100, 50]],
15+
[[270, 33, 50], [270, 66, 50], [270, 100, 50]]
1616
],
1717
"xaxis": "x2",
1818
"yaxis": "y2"

‎test/image/mocks/image_zmin_zmax.json

Copy file name to clipboard
+21Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
{
2+
"data": [{
3+
"type": "image",
4+
"z": [[[255, 0, 0], [0, 255, 0], [0, 0, 255]]],
5+
"zmin": [0, 0, 0],
6+
"zmax": [255, 255, 255]
7+
}, {
8+
"type": "image",
9+
"z": [[[1, 0, 0], [0, 1, 0], [0, 0, 1]]],
10+
"zmax": [1, 1, 1],
11+
"yaxis": "y3",
12+
"xaxis": "x3"
13+
}],
14+
"layout": {
15+
"width": 400, "height": 400,
16+
"grid": {"rows": 2, "columns": 2, "pattern": "independent"},
17+
"title": {
18+
"text": "zmin zmax"
19+
}
20+
}
21+
}

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.