@refinitiv-ui/efx-grid 6.0.133 → 6.0.134
Sign up to get free protection for your applications and to get access to all the features.
package/lib/grid/index.js
CHANGED
@@ -7,10 +7,10 @@ declare namespace HeatMapPlugin {
|
|
7
7
|
|
8
8
|
type ColumnOptions = {
|
9
9
|
field: string,
|
10
|
-
heatMap?: HeatMapPlugin.
|
10
|
+
heatMap?: HeatMapPlugin.HeatMap|null
|
11
11
|
};
|
12
12
|
|
13
|
-
type
|
13
|
+
type HeatMap = {
|
14
14
|
midPoint?: number|null,
|
15
15
|
mode?: string|null
|
16
16
|
};
|
@@ -6,11 +6,11 @@ import {ElfUtil} from '../../tr-grid-util/es6/ElfUtil.js';
|
|
6
6
|
/** @typedef {Object} HeatMapPlugin~ColumnOptions
|
7
7
|
* @description Extension column options that can be specified on each individual grid's column option:
|
8
8
|
* @property {string} field Field used by the heat map
|
9
|
-
* @property {HeatMapPlugin~
|
9
|
+
* @property {HeatMapPlugin~HeatMap=} heatMap=null Heat map options
|
10
10
|
*/
|
11
11
|
|
12
|
-
/** @typedef {
|
13
|
-
* @description Available options describing `
|
12
|
+
/** @typedef {Object} HeatMapPlugin~HeatMap
|
13
|
+
* @description Available options describing `heatMap` object
|
14
14
|
* @property {number=} midPoint=0 Middle point between values representing up and down colors
|
15
15
|
* @property {string=} mode="cell" In cell mode, heat map color will be applied to the entire cell
|
16
16
|
*/
|
@@ -18,7 +18,7 @@ import {ElfUtil} from '../../tr-grid-util/es6/ElfUtil.js';
|
|
18
18
|
/** @constructor
|
19
19
|
* @extends {GridPlugin}
|
20
20
|
*/
|
21
|
-
|
21
|
+
let HeatMapPlugin = function () {
|
22
22
|
this._onSectionBinding = this._onSectionBinding.bind(this);
|
23
23
|
this._onColumnAdded = this._onColumnAdded.bind(this);
|
24
24
|
this._onColumnRemoved = this._onColumnRemoved.bind(this);
|
@@ -78,9 +78,9 @@ HeatMapPlugin.prototype.initialize = function (host, options) {
|
|
78
78
|
*/
|
79
79
|
HeatMapPlugin.prototype._afterInit = function () {
|
80
80
|
if(this._realTimeGrid) {
|
81
|
-
|
82
|
-
|
83
|
-
for(
|
81
|
+
let colStats, painter;
|
82
|
+
let colCount = this.getColumnCount();
|
83
|
+
for(let c = 0; c < colCount; c++) {
|
84
84
|
painter = this.getColumnHeatMap(c);
|
85
85
|
if(painter) {
|
86
86
|
colStats = painter.getColumnStats();
|
@@ -95,7 +95,7 @@ HeatMapPlugin.prototype._afterInit = function () {
|
|
95
95
|
* @param {Object} host core grid object
|
96
96
|
*/
|
97
97
|
HeatMapPlugin.prototype.unload = function (host) {
|
98
|
-
|
98
|
+
let at = this._hosts.indexOf(host);
|
99
99
|
if(at < 0) { return; }
|
100
100
|
|
101
101
|
this._hosts.splice(at, 1);
|
@@ -114,12 +114,12 @@ HeatMapPlugin.prototype.unload = function (host) {
|
|
114
114
|
HeatMapPlugin.prototype.config = function (options, opt_grid) {
|
115
115
|
if(!options) { return; }
|
116
116
|
|
117
|
-
|
117
|
+
let columns = options["columns"];
|
118
118
|
if(!columns) { return; }
|
119
119
|
|
120
|
-
|
121
|
-
for(
|
122
|
-
|
120
|
+
let len = columns.length;
|
121
|
+
for(let i = 0; i < len; ++i) {
|
122
|
+
let column = columns[i];
|
123
123
|
this.setColumnHeatMap(i, column, opt_grid);
|
124
124
|
}
|
125
125
|
};
|
@@ -130,22 +130,22 @@ HeatMapPlugin.prototype.config = function (options, opt_grid) {
|
|
130
130
|
* @returns {!Object}
|
131
131
|
*/
|
132
132
|
HeatMapPlugin.prototype.getConfigObject = function (out_obj) {
|
133
|
-
|
133
|
+
let obj = out_obj || {};
|
134
134
|
|
135
|
-
|
135
|
+
let columns = obj.columns;
|
136
136
|
if (!columns) {
|
137
137
|
columns = obj.columns = [];
|
138
138
|
}
|
139
139
|
|
140
|
-
|
141
|
-
for(
|
142
|
-
|
140
|
+
let len = this.getColumnCount();
|
141
|
+
for(let i = 0; i < len; ++i) {
|
142
|
+
let col = columns[i];
|
143
143
|
if (!col) {
|
144
144
|
col = columns[i] = {};
|
145
145
|
}
|
146
146
|
|
147
147
|
|
148
|
-
|
148
|
+
let opt = this.getColumnHeatMap(i);
|
149
149
|
|
150
150
|
if (!opt) { // We are only interested in the columns that have heat map informations
|
151
151
|
continue;
|
@@ -157,7 +157,7 @@ HeatMapPlugin.prototype.getConfigObject = function (out_obj) {
|
|
157
157
|
continue;
|
158
158
|
}
|
159
159
|
|
160
|
-
|
160
|
+
let heatMap = col.heatMap = {};
|
161
161
|
|
162
162
|
if (opt.midPoint != null) {
|
163
163
|
heatMap.midPoint = opt.midPoint;
|
@@ -177,7 +177,7 @@ HeatMapPlugin.prototype.getConfigObject = function (out_obj) {
|
|
177
177
|
* @return {CellPainter}
|
178
178
|
*/
|
179
179
|
HeatMapPlugin.prototype.getColumnHeatMap = function (colIndex, grid) {
|
180
|
-
|
180
|
+
let painter = this._getColumnOption(colIndex, "painter", grid);
|
181
181
|
if(painter && painter.getColoringType() === CellPainter.ColoringTypes.HEATMAP) {
|
182
182
|
return /** @type{CellPainter} */painter;
|
183
183
|
}
|
@@ -190,7 +190,7 @@ HeatMapPlugin.prototype.getColumnHeatMap = function (colIndex, grid) {
|
|
190
190
|
* @param {Object=} opt_grid core grid object
|
191
191
|
* @example
|
192
192
|
* plugin.setColumnHeatMap(1, {
|
193
|
-
* "field": "CF_LAST"
|
193
|
+
* "field": "CF_LAST",
|
194
194
|
* "heatMap": {
|
195
195
|
* "midPoint": 0, // optional number
|
196
196
|
* "mode": "cell" // optional string (cell|text)
|
@@ -198,15 +198,15 @@ HeatMapPlugin.prototype.getColumnHeatMap = function (colIndex, grid) {
|
|
198
198
|
* });
|
199
199
|
*/
|
200
200
|
HeatMapPlugin.prototype.setColumnHeatMap = function (colIndex, columnDef, opt_grid) {
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
201
|
+
let hmMode = "";
|
202
|
+
let midPoint = 0;
|
203
|
+
let field = columnDef ? /** @type{string} */(columnDef["field"]) : "";
|
204
|
+
let hmOptions = field ? columnDef["heatMap"] || columnDef["heatmap"] : null;
|
205
205
|
if(hmOptions) {
|
206
|
-
|
206
|
+
let userMode = hmOptions["mode"] || hmOptions["type"];
|
207
207
|
hmMode = (typeof userMode == "string") ? userMode : "cell";
|
208
208
|
|
209
|
-
|
209
|
+
let userMidPoint = /** @type{number} */(hmOptions["midPoint"]);
|
210
210
|
if(typeof userMidPoint != "number") {
|
211
211
|
userMidPoint = +userMidPoint;
|
212
212
|
}
|
@@ -215,7 +215,7 @@ HeatMapPlugin.prototype.setColumnHeatMap = function (colIndex, columnDef, opt_gr
|
|
215
215
|
if(opt_grid) {
|
216
216
|
this._setColumnHeatMap(opt_grid, colIndex, hmMode, midPoint, field);
|
217
217
|
} else {
|
218
|
-
for(
|
218
|
+
for(let i = this._hosts.length; --i >= 0;) {
|
219
219
|
this._setColumnHeatMap(this._hosts[i], colIndex, hmMode, midPoint, field);
|
220
220
|
}
|
221
221
|
}
|
@@ -228,17 +228,16 @@ HeatMapPlugin.prototype.setColumnHeatMap = function (colIndex, columnDef, opt_gr
|
|
228
228
|
* @param {string} field
|
229
229
|
*/
|
230
230
|
HeatMapPlugin.prototype._setColumnHeatMap = function (grid, colIndex, hmMode, midPoint, field) {
|
231
|
-
|
231
|
+
let dv = grid.getDataSource();
|
232
232
|
if(!dv) {
|
233
|
-
console.log("Heat map requires a data source");
|
234
233
|
return;
|
235
234
|
}
|
236
235
|
|
237
|
-
|
238
|
-
|
236
|
+
let colData = this._newColumnData(colIndex);
|
237
|
+
let painter = /** @type{CellPainter} */(colData["painter"]);
|
239
238
|
|
240
|
-
|
241
|
-
if(hmMode && field) { // Update or create new painter for
|
239
|
+
let cond, sect, rowCount, r, cell;
|
240
|
+
if(hmMode && field) { // Update or create new painter for heatMap
|
242
241
|
if(painter) {
|
243
242
|
// Clear currrent style, blinking and existing styles related to blinking
|
244
243
|
sect = grid.getSection("content");
|
@@ -265,7 +264,7 @@ HeatMapPlugin.prototype._setColumnHeatMap = function (grid, colIndex, hmMode, mi
|
|
265
264
|
cond = painter.addHeatmapWithTheme(field, midPoint, (hmMode === "text"));
|
266
265
|
cond.refId = "_hm" + HeatMapPlugin._runningId++;
|
267
266
|
|
268
|
-
|
267
|
+
let colStats = dv.enableColumnStats(field, true, cond.refId);
|
269
268
|
if(this._initializedGrid && this._realTimeGrid) {
|
270
269
|
colStats.setColumnDataGetter(colDataGetter);
|
271
270
|
}
|
@@ -276,7 +275,7 @@ HeatMapPlugin.prototype._setColumnHeatMap = function (grid, colIndex, hmMode, mi
|
|
276
275
|
} else {
|
277
276
|
if(painter) {
|
278
277
|
if(this._clearPainter(colData, grid)) {
|
279
|
-
// Clear existing
|
278
|
+
// Clear existing heatMap styles
|
280
279
|
grid.enableColumnClass(colIndex, "heat-map", false);
|
281
280
|
sect = grid.getSection("content");
|
282
281
|
rowCount = sect.getRowCount();
|
@@ -306,7 +305,7 @@ HeatMapPlugin.prototype._setColumnHeatMap = function (grid, colIndex, hmMode, mi
|
|
306
305
|
HeatMapPlugin.prototype.getColumnHeatMapOptions = function(colIndex, options) {
|
307
306
|
if(!options) { options = {}; }
|
308
307
|
|
309
|
-
|
308
|
+
let hm = this.getColumnHeatMap(colIndex);
|
310
309
|
if(hm) {
|
311
310
|
options["midPoint"] = hm["midPoint"];
|
312
311
|
options["mode"] = hm["mode"];
|
@@ -321,11 +320,11 @@ HeatMapPlugin.prototype.getColumnHeatMapOptions = function(colIndex, options) {
|
|
321
320
|
*/
|
322
321
|
HeatMapPlugin.prototype._clearPainter = function (colData, grid) {
|
323
322
|
if(colData) {
|
324
|
-
|
323
|
+
let painter = colData["painter"];
|
325
324
|
if(painter && painter.getColoringType() === CellPainter.ColoringTypes.HEATMAP) {
|
326
|
-
|
325
|
+
let cond = painter.getConditions()[0];
|
327
326
|
if(cond) {
|
328
|
-
|
327
|
+
let dv = grid.getDataSource();
|
329
328
|
dv.enableColumnStats(cond.field, false, cond.refId);
|
330
329
|
}
|
331
330
|
if(painter.clearHeatMap()) {
|
@@ -338,7 +337,7 @@ HeatMapPlugin.prototype._clearPainter = function (colData, grid) {
|
|
338
337
|
};
|
339
338
|
/** @private */
|
340
339
|
HeatMapPlugin.prototype._onThemeLoaded = function () {
|
341
|
-
for(
|
340
|
+
for(let i = this._hosts.length; --i >= 0;) {
|
342
341
|
this._hosts[i].requestRowRefresh();
|
343
342
|
}
|
344
343
|
};
|
@@ -350,21 +349,21 @@ HeatMapPlugin.prototype._onSectionBinding = function (e) {
|
|
350
349
|
return;
|
351
350
|
}
|
352
351
|
|
353
|
-
|
354
|
-
|
355
|
-
|
356
|
-
|
357
|
-
|
358
|
-
|
352
|
+
let grid = e["sender"];
|
353
|
+
let section = e["section"];
|
354
|
+
let dataRows = /** @type{Array.<Object>} */(e["dataRows"]);
|
355
|
+
let colCount = section.getColumnCount();
|
356
|
+
let fromR = /** @type{number} */(e["fromRowIndex"]);
|
357
|
+
let toR = /** @type{number} */(e["toRowIndex"]);
|
359
358
|
|
360
|
-
for (
|
361
|
-
|
359
|
+
for (let c = 0; c < colCount; ++c) {
|
360
|
+
let painter = this.getColumnHeatMap(c, grid);
|
362
361
|
if(painter) {
|
363
|
-
|
364
|
-
|
365
|
-
|
366
|
-
for (
|
367
|
-
|
362
|
+
let columnStats = painter.getColumnStats();
|
363
|
+
let min = columnStats.getMin();
|
364
|
+
let max = columnStats.getMax();
|
365
|
+
for (let r = fromR; r < toR; ++r) {
|
366
|
+
let cell = section.getCell(c, r, false);
|
368
367
|
if(cell) {
|
369
368
|
painter.renderHeatMap(cell, this._getRowData(dataRows[r]), min, max);
|
370
369
|
}
|
@@ -379,9 +378,9 @@ HeatMapPlugin.prototype._onColumnAdded = function(e) {
|
|
379
378
|
if(e.context) {
|
380
379
|
this.setColumnHeatMap(e.colIndex, e.context, e.sender);
|
381
380
|
if(this._realTimeGrid) {
|
382
|
-
|
381
|
+
let painter = this.getColumnHeatMap(e.colIndex);
|
383
382
|
if(painter) {
|
384
|
-
|
383
|
+
let colStats = painter.getColumnStats();
|
385
384
|
if(colStats) {
|
386
385
|
colStats.setColumnDataGetter(colDataGetter);
|
387
386
|
}
|
@@ -7,10 +7,10 @@ declare namespace HeatMapPlugin {
|
|
7
7
|
|
8
8
|
type ColumnOptions = {
|
9
9
|
field: string,
|
10
|
-
heatMap?: HeatMapPlugin.
|
10
|
+
heatMap?: HeatMapPlugin.HeatMap|null
|
11
11
|
};
|
12
12
|
|
13
|
-
type
|
13
|
+
type HeatMap = {
|
14
14
|
midPoint?: number|null,
|
15
15
|
mode?: string|null
|
16
16
|
};
|
package/lib/versions.json
CHANGED
@@ -18,7 +18,7 @@
|
|
18
18
|
"tr-grid-content-wrap": "1.0.20",
|
19
19
|
"tr-grid-contextmenu": "1.0.44",
|
20
20
|
"tr-grid-filter-input": "0.9.43",
|
21
|
-
"tr-grid-heat-map": "1.0.
|
21
|
+
"tr-grid-heat-map": "1.0.30",
|
22
22
|
"tr-grid-in-cell-editing": "1.0.90",
|
23
23
|
"tr-grid-pagination": "1.0.24",
|
24
24
|
"tr-grid-percent-bar": "1.0.24",
|
package/package.json
CHANGED