@refinitiv-ui/efx-grid 6.0.133 → 6.0.134
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
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