Skip to content

Commit 7629837

Browse files
authored
Merge pull request #655 from plotly/heatmap-multi-trace
Mulitple fixes for multi-heatmap-trace plots
2 parents d16393b + 7a2dc05 commit 7629837

File tree

5 files changed

+323
-19
lines changed

5 files changed

+323
-19
lines changed

src/traces/heatmap/hover.js

+8-4
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,12 @@
1212
var Fx = require('../../plots/cartesian/graph_interact');
1313
var Lib = require('../../lib');
1414

15+
var MAXDIST = require('../../plots/cartesian/constants').MAXDIST;
16+
1517

1618
module.exports = function hoverPoints(pointData, xval, yval, hovermode, contour) {
1719
// never let a heatmap override another type as closest point
18-
if(pointData.distance < Fx.MAXDIST) return;
20+
if(pointData.distance < MAXDIST) return;
1921

2022
var cd0 = pointData.cd[0],
2123
trace = cd0.trace,
@@ -46,8 +48,8 @@ module.exports = function hoverPoints(pointData, xval, yval, hovermode, contour)
4648
return;
4749
}
4850
}
49-
else if(Fx.inbox(xval - x[0], xval - x[x.length - 1]) > Fx.MAXDIST ||
50-
Fx.inbox(yval - y[0], yval - y[y.length - 1]) > Fx.MAXDIST) {
51+
else if(Fx.inbox(xval - x[0], xval - x[x.length - 1]) > MAXDIST ||
52+
Fx.inbox(yval - y[0], yval - y[y.length - 1]) > MAXDIST) {
5153
return;
5254
}
5355
else {
@@ -69,10 +71,12 @@ module.exports = function hoverPoints(pointData, xval, yval, hovermode, contour)
6971
nx = Math.max(0, Math.min(x2.length - 2, Lib.findBin(xval, x2)));
7072
ny = Math.max(0, Math.min(y2.length - 2, Lib.findBin(yval, y2)));
7173
}
74+
7275
var x0 = xa.c2p(x[nx]),
7376
x1 = xa.c2p(x[nx + 1]),
7477
y0 = ya.c2p(y[ny]),
7578
y1 = ya.c2p(y[ny + 1]);
79+
7680
if(contour) {
7781
x1 = x0;
7882
xl = x[nx];
@@ -99,7 +103,7 @@ module.exports = function hoverPoints(pointData, xval, yval, hovermode, contour)
99103
return [Lib.extendFlat(pointData, {
100104
index: [ny, nx],
101105
// never let a 2D override 1D type as closest point
102-
distance: Fx.MAXDIST + 10,
106+
distance: MAXDIST + 10,
103107
x0: x0,
104108
x1: x1,
105109
y0: y0,

src/traces/heatmap/plot.js

+24-15
Original file line numberDiff line numberDiff line change
@@ -137,10 +137,24 @@ function plotOne(gd, plotinfo, cd) {
137137
var imageWidth = Math.round(right - left),
138138
imageHeight = Math.round(bottom - top);
139139

140-
// now redraw
140+
// setup image nodes
141141

142142
// if image is entirely off-screen, don't even draw it
143-
if(imageWidth <= 0 || imageHeight <= 0) return;
143+
var isOffScreen = (imageWidth <= 0 || imageHeight <= 0);
144+
145+
var plotgroup = plotinfo.plot.select('.imagelayer')
146+
.selectAll('g.hm.' + id)
147+
.data(isOffScreen ? [] : [0]);
148+
149+
plotgroup.enter().append('g')
150+
.classed('hm', true)
151+
.classed(id, true);
152+
153+
plotgroup.exit().remove();
154+
155+
if(isOffScreen) return;
156+
157+
// generate image data
144158

145159
var canvasW, canvasH;
146160
if(zsmooth === 'fast') {
@@ -363,26 +377,21 @@ function plotOne(gd, plotinfo, cd) {
363377
gd._hmpixcount = (gd._hmpixcount||0) + pixcount;
364378
gd._hmlumcount = (gd._hmlumcount||0) + pixcount * avgColor.getLuminance();
365379

366-
var plotgroup = plotinfo.plot.select('.imagelayer')
367-
.selectAll('g.hm.' + id)
368-
.data([0]);
369-
plotgroup.enter().append('g')
370-
.classed('hm', true)
371-
.classed(id, true);
372-
plotgroup.exit().remove();
373-
374380
var image3 = plotgroup.selectAll('image')
375381
.data(cd);
376-
image3.enter().append('svg:image');
377-
image3.exit().remove();
378382

379-
image3.attr({
383+
image3.enter().append('svg:image').attr({
380384
xmlns: xmlnsNamespaces.svg,
381385
'xlink:href': canvas.toDataURL('image/png'),
386+
preserveAspectRatio: 'none'
387+
});
388+
389+
image3.attr({
382390
height: imageHeight,
383391
width: imageWidth,
384392
x: left,
385-
y: top,
386-
preserveAspectRatio: 'none'
393+
y: top
387394
});
395+
396+
image3.exit().remove();
388397
}
23 KB
Loading
+193
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,193 @@
1+
{
2+
"data": [
3+
{
4+
"x": [
5+
1,
6+
1,
7+
1,
8+
1,
9+
1,
10+
1
11+
],
12+
"y": [
13+
0,
14+
1,
15+
2,
16+
3,
17+
4,
18+
5
19+
],
20+
"z": [
21+
3,
22+
4,
23+
2,
24+
5,
25+
3,
26+
1
27+
],
28+
"type": "heatmap",
29+
"showlegend": false,
30+
"showscale": false,
31+
"zmax": 5,
32+
"zmin": 1
33+
},
34+
{
35+
"x": [
36+
2,
37+
2,
38+
2,
39+
2,
40+
2
41+
],
42+
"y": [
43+
0.2,
44+
1.2,
45+
2.2,
46+
3.2,
47+
4.2
48+
],
49+
"z": [
50+
6,
51+
1,
52+
3,
53+
2,
54+
4
55+
],
56+
"type": "heatmap",
57+
"showlegend": false,
58+
"showscale": false,
59+
"zmax": 6,
60+
"zmin": 1
61+
},
62+
{
63+
"x": [
64+
3,
65+
3,
66+
3,
67+
3,
68+
3,
69+
3,
70+
3,
71+
3,
72+
3,
73+
3,
74+
3
75+
],
76+
"y": [
77+
0,
78+
0.5,
79+
1,
80+
1.5,
81+
2,
82+
2.5,
83+
3,
84+
3.5,
85+
4,
86+
4.5,
87+
5
88+
],
89+
"z": [
90+
6,
91+
1,
92+
3,
93+
2,
94+
4,
95+
2,
96+
7,
97+
4,
98+
3,
99+
2,
100+
5
101+
],
102+
"type": "heatmap",
103+
"showlegend": false,
104+
"showscale": false,
105+
"zmax": 7,
106+
"zmin": 1
107+
},
108+
{
109+
"x": [
110+
4,
111+
4,
112+
4,
113+
4,
114+
4,
115+
4
116+
],
117+
"y": [
118+
0,
119+
0.2,
120+
0.5,
121+
1.2,
122+
3.5,
123+
4
124+
],
125+
"z": [
126+
2,
127+
4,
128+
7,
129+
3,
130+
2,
131+
1
132+
],
133+
"type": "heatmap",
134+
"showlegend": false,
135+
"showscale": false,
136+
"zmax": 7,
137+
"zmin": 1
138+
},
139+
{
140+
"x": [
141+
5.2,
142+
5.2,
143+
5.2,
144+
5.2,
145+
5.2,
146+
5.2
147+
],
148+
"y": [
149+
0,
150+
0.2,
151+
0.5,
152+
1.2,
153+
3.5,
154+
4
155+
],
156+
"z": [
157+
2,
158+
4,
159+
7,
160+
3,
161+
2,
162+
1
163+
],
164+
"type": "heatmap",
165+
"showlegend": false,
166+
"showscale": true,
167+
"zmax": 10,
168+
"zmin": 0
169+
}
170+
],
171+
"layout": {
172+
"hovermode": "closest",
173+
"xaxis": {
174+
"type": "linear",
175+
"range": [
176+
0.5,
177+
5.7
178+
],
179+
"autorange": true
180+
},
181+
"yaxis": {
182+
"type": "linear",
183+
"range": [
184+
-0.5,
185+
5.5
186+
],
187+
"autorange": true
188+
},
189+
"height": 450,
190+
"width": 1100,
191+
"autosize": true
192+
}
193+
}

0 commit comments

Comments
 (0)