Skip to content

Commit d091f13

Browse files
etpinardetpinard
committed
wip heatmapgl (got a plot to show up)
1 parent 6e2742b commit d091f13

File tree

5 files changed

+217
-17
lines changed

5 files changed

+217
-17
lines changed

‎src/plots/gl2d/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ exports.plot = function plotGl2d(gd) {
6262
subplotObj._scene2d = scene;
6363
}
6464

65-
scene.plot(fullSubplotData, fullLayout, gd.layout);
65+
scene.plot(fullSubplotData, gd.calcdata, fullLayout, gd.layout);
6666
}
6767
};
6868

‎src/plots/gl2d/scene2d.js‎

Lines changed: 14 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@
99

1010
'use strict';
1111

12-
var Plots = require('../../plots/plots');
1312
var Axes = require('../../plots/cartesian/axes');
1413
var Fx = require('../../plots/cartesian/graph_interact');
1514

@@ -19,7 +18,6 @@ var createSelectBox = require('gl-select-box');
1918

2019
var createOptions = require('./convert');
2120
var createCamera = require('./camera');
22-
2321
var htmlToUnicode = require('../../lib/html2unicode');
2422
var showNoWebGlMsg = require('../../lib/show_no_webgl_msg');
2523

@@ -301,11 +299,11 @@ proto.destroy = function() {
301299
this.stopped = true;
302300
};
303301

304-
proto.plot = function(fullData, fullLayout) {
302+
proto.plot = function(fullData, calcData, fullLayout) {
305303
var glplot = this.glplot,
306304
pixelRatio = this.pixelRatio;
307305

308-
var i, j;
306+
var i, j, trace;
309307

310308
this.fullLayout = fullLayout;
311309
this.updateAxes(fullLayout);
@@ -322,30 +320,27 @@ proto.plot = function(fullData, fullLayout) {
322320
canvas.height = pixelHeight;
323321
}
324322

325-
if(!fullData) fullData = [];
326-
else if(!Array.isArray(fullData)) fullData = [fullData];
327-
328323
// update traces
329-
var traceData, trace;
330324
for(i = 0; i < fullData.length; ++i) {
331-
traceData = fullData[i];
332-
trace = this.traces[traceData.uid];
325+
var fullTrace = fullData[i],
326+
calcTrace = calcData[i];
327+
trace = this.traces[fullTrace.uid];
333328

334-
if(trace) trace.update(traceData);
329+
if(trace) trace.update(fullTrace, calcTrace);
335330
else {
336-
var traceModule = Plots.getModule(traceData.type);
337-
trace = traceModule.plot(this, traceData);
331+
trace = fullTrace._module.plot(this, fullTrace, calcTrace);
338332
}
339-
this.traces[traceData.uid] = trace;
333+
334+
this.traces[fullTrace.uid] = trace;
340335
}
341336

342337
// remove empty traces
343338
var traceIds = Object.keys(this.traces);
344339

345340
trace_id_loop:
346341
for(i = 0; i < traceIds.length; ++i) {
347-
for(j = 0; j < fullData.length; ++j) {
348-
if(fullData[j].uid === traceIds[i]) continue trace_id_loop;
342+
for(j = 0; j < calcData.length; ++j) {
343+
if(calcData[j][0].trace.uid === traceIds[i]) continue trace_id_loop;
349344
}
350345

351346
trace = this.traces[traceIds[i]];
@@ -452,9 +447,12 @@ proto.draw = function() {
452447
(y / glplot.pixelRatio) - (size.t + (1-domainY[1]) * size.h)
453448
);
454449

450+
455451
if(result && fullLayout.hovermode) {
456452
var nextSelection = result.object._trace.handlePick(result);
457453

454+
console.log(result.dataCoord, result.pointId)
455+
458456
if(nextSelection && (
459457
!this.lastPickResult ||
460458
this.lastPickResult.trace !== nextSelection.trace ||

‎src/traces/heatmapgl/attributes.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
/**
2+
* Copyright 2012-2016, 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+
'use strict';
10+
11+
12+
var heatmapAttrs = require('../scatter/attributes');
13+
14+
module.exports = heatmapAttrs;

‎src/traces/heatmapgl/convert.js‎

Lines changed: 157 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,157 @@
1+
/**
2+
* Copyright 2012-2015, 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+
var createHeatmap2D = require('gl-heatmap2d');
13+
14+
var maxRowLength = require('../heatmap/max_row_length');
15+
var str2RGBArray = require('../../lib/str2rgbarray');
16+
17+
var AXES = ['xaxis', 'yaxis'];
18+
19+
20+
function Heatmap(scene, uid) {
21+
this.scene = scene;
22+
this.uid = uid;
23+
24+
this.name = '';
25+
this.hoverinfo = 'all';
26+
27+
this.xData = [];
28+
this.yData = [];
29+
this.zData = [];
30+
this.textLabels = [];
31+
32+
this.idToIndex = [];
33+
this.bounds = [0, 0, 0, 0];
34+
35+
this.options = {
36+
z: [],
37+
x: [],
38+
y: [],
39+
shape: [0, 0],
40+
colorLevels: [0],
41+
colorValues: [0, 0, 0, 1]
42+
};
43+
44+
this.heatmap = createHeatmap2D(scene.glplot, this.options);
45+
this.heatmap._trace = this;
46+
}
47+
48+
var proto = Heatmap.prototype;
49+
50+
proto.handlePick = function(pickResult) {
51+
var index = this.idToIndex[pickResult.pointId];
52+
53+
// console.log(pickResult.pointId)
54+
55+
return {
56+
trace: this,
57+
dataCoord: pickResult.dataCoord,
58+
traceCoord: [
59+
this.xData[index],
60+
this.yData[index]
61+
],
62+
textLabel: Array.isArray(this.textLabels) ?
63+
this.textLabels[index] :
64+
this.textLabels,
65+
color: Array.isArray(this.color) ?
66+
this.color[index] :
67+
this.color,
68+
name: this.name,
69+
hoverinfo: this.hoverinfo
70+
};
71+
};
72+
73+
proto.update = function(fullTrace, calcTrace) {
74+
var calcPt = calcTrace[0];
75+
76+
this.textLabels = fullTrace.text;
77+
this.name = fullTrace.name;
78+
this.hoverinfo = fullTrace.hoverinfo;
79+
80+
// convert z from 2D -> 1D
81+
var z = calcPt.z;
82+
this.options.z = [].concat.apply([], z);
83+
84+
var rowLen = z[0].length,
85+
colLen = z.length;
86+
this.options.shape = [rowLen, colLen];
87+
88+
// don't use calc'ed bricks
89+
// maybe use xa.makeCalcdata() ???
90+
var x = fullTrace.x;
91+
if(x) {
92+
this.options.x = x;
93+
this.bounds[0] = x[0];
94+
this.bounds[2] = x[rowLen - 1];
95+
}
96+
else {
97+
this.options.x = null;
98+
this.bounds[0] = 0;
99+
this.bounds[2] = rowLen
100+
}
101+
102+
var y = fullTrace.y;
103+
if(y) {
104+
this.options.y = y;
105+
this.bounds[1] = y[0];
106+
this.bounds[3] = y[colLen - 1];
107+
}
108+
else {
109+
this.options.y = null;
110+
this.bounds[1] = 0;
111+
this.bounds[3] = colLen
112+
}
113+
114+
var colorOptions = convertColorscale(fullTrace);
115+
this.options.colorLevels = colorOptions.colorLevels;
116+
this.options.colorValues = colorOptions.colorValues;
117+
118+
this.heatmap.update(this.options);
119+
};
120+
121+
proto.dispose = function() {
122+
this.heatmap.dispose();
123+
};
124+
125+
function convertColorscale(fullTrace) {
126+
var scl = fullTrace.colorscale,
127+
zmin = fullTrace.zmin,
128+
zmax = fullTrace.zmax;
129+
130+
var N = scl.length,
131+
domain = new Array(N),
132+
range = new Array(4 * N);
133+
134+
for(var i = 0; i < N; i++) {
135+
var si = scl[i];
136+
var color = str2RGBArray(si[1]);
137+
138+
domain[i] = zmin + si[0] * (zmax - zmin);
139+
140+
for(var j = 0; j < 4; j++) {
141+
range[(4 * i) + j] = color[j];
142+
}
143+
}
144+
145+
return {
146+
colorLevels: domain,
147+
colorValues: range
148+
};
149+
}
150+
151+
function createHeatmap(scene, fullTrace, calcTrace) {
152+
var plot = new Heatmap(scene, fullTrace.uid);
153+
plot.update(fullTrace, calcTrace);
154+
return plot;
155+
}
156+
157+
module.exports = createHeatmap;

‎src/traces/heatmapgl/index.js‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
/**
2+
* Copyright 2012-2015, 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+
var HeatmapGl = {};
13+
14+
HeatmapGl.attributes = require('./attributes');
15+
HeatmapGl.supplyDefaults = require('../heatmap/defaults');
16+
HeatmapGl.colorbar = require('../heatmap/colorbar');
17+
18+
HeatmapGl.calc = require('../heatmap/calc');
19+
HeatmapGl.plot = require('./convert');
20+
21+
HeatmapGl.moduleType = 'trace';
22+
HeatmapGl.name = 'heatmapgl';
23+
HeatmapGl.basePlotModule = require('../../plots/gl2d');
24+
HeatmapGl.categories = ['gl2d', '2dMap'];
25+
HeatmapGl.meta = {
26+
description: [
27+
'HIGH PERFORMANCE HEATMAPS BABY !!!'
28+
].join(' ')
29+
};
30+
31+
module.exports = HeatmapGl;

0 commit comments

Comments
 (0)