tdCellStyle is black on black when cellData is nully and heatmap plugin is used

[clementdevos]

Hey @pbeshai ,

Using the HeatmapData, for some data sets (see sample) we have one (or multiple) columns that are blacked out even if data looks good.

Render :

Dataset

[
   {
      "data":[
         {
            "idStore":"90",
            "value":1498
         },
         {
            "idStore":"243",
            "value":860
         },
         {
            "idStore":"8",
            "value":69
         },
         {
            "idStore":"78",
            "value":629
         },
         {
            "idStore":"539",
            "value":93
         },
         {
            "idStore":"468",
            "value":19
         },
         {
            "idStore":"429",
            "value":379
         },
         {
            "idStore":"426",
            "value":489
         }
      ],
      "label":"8326542 - EAU SPORT 500ML FR",
      "id":"mdl_num_modele_r3_detail_term_agg:8326542"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":1001
         },
         {
            "idStore":"58",
            "value":580
         },
         {
            "idStore":"243",
            "value":452
         },
         {
            "idStore":"8",
            "value":283
         },
         {
            "idStore":"78",
            "value":330
         },
         {
            "idStore":"539",
            "value":341
         },
         {
            "idStore":"468",
            "value":311
         },
         {
            "idStore":"429",
            "value":331
         },
         {
            "idStore":"426",
            "value":477
         }
      ],
      "label":"8070922 - ARTENGO TB 720",
      "id":"mdl_num_modele_r3_detail_term_agg:8070922"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":998
         },
         {
            "idStore":"58",
            "value":673
         },
         {
            "idStore":"243",
            "value":445
         },
         {
            "idStore":"8",
            "value":195
         },
         {
            "idStore":"78",
            "value":366
         },
         {
            "idStore":"539",
            "value":324
         },
         {
            "idStore":"468",
            "value":366
         },
         {
            "idStore":"429",
            "value":299
         },
         {
            "idStore":"426",
            "value":131
         }
      ],
      "label":"1898879 - ARTENGO TB 800",
      "id":"mdl_num_modele_r3_detail_term_agg:1898879"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":983
         },
         {
            "idStore":"58",
            "value":108
         },
         {
            "idStore":"243",
            "value":1403
         },
         {
            "idStore":"8",
            "value":404
         },
         {
            "idStore":"78",
            "value":1586
         },
         {
            "idStore":"539",
            "value":1107
         },
         {
            "idStore":"468",
            "value":47
         },
         {
            "idStore":"429",
            "value":250
         },
         {
            "idStore":"426",
            "value":859
         }
      ],
      "label":"8134450 - RECYCLABLE DECATHLON BAG",
      "id":"mdl_num_modele_r3_detail_term_agg:8134450"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":900
         },
         {
            "idStore":"243",
            "value":729
         },
         {
            "idStore":"8",
            "value":724
         },
         {
            "idStore":"78",
            "value":617
         },
         {
            "idStore":"539",
            "value":145
         },
         {
            "idStore":"468",
            "value":710
         },
         {
            "idStore":"429",
            "value":603
         },
         {
            "idStore":"426",
            "value":1187
         }
      ],
      "label":"601833 - VITTEL SPORT BOTTLE",
      "id":"mdl_num_modele_r3_detail_term_agg:601833"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":698
         },
         {
            "idStore":"58",
            "value":362
         },
         {
            "idStore":"243",
            "value":360
         },
         {
            "idStore":"8",
            "value":77
         },
         {
            "idStore":"78",
            "value":702
         },
         {
            "idStore":"539",
            "value":517
         },
         {
            "idStore":"468",
            "value":278
         },
         {
            "idStore":"429",
            "value":381
         },
         {
            "idStore":"426",
            "value":235
         }
      ],
      "label":"8124330 - RS750 LOW X3 WHITE",
      "id":"mdl_num_modele_r3_detail_term_agg:8124330"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":679
         },
         {
            "idStore":"58",
            "value":290
         },
         {
            "idStore":"243",
            "value":105
         },
         {
            "idStore":"8",
            "value":84
         },
         {
            "idStore":"78",
            "value":88
         },
         {
            "idStore":"539",
            "value":170
         },
         {
            "idStore":"468",
            "value":113
         },
         {
            "idStore":"429",
            "value":136
         },
         {
            "idStore":"426",
            "value":92
         }
      ],
      "label":"8324909 - SOCKS ELIOFEEL INV   WHITE",
      "id":"mdl_num_modele_r3_detail_term_agg:8324909"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":667
         },
         {
            "idStore":"58",
            "value":412
         },
         {
            "idStore":"243",
            "value":620
         },
         {
            "idStore":"8",
            "value":420
         },
         {
            "idStore":"78",
            "value":672
         },
         {
            "idStore":"539",
            "value":676
         },
         {
            "idStore":"468",
            "value":525
         },
         {
            "idStore":"429",
            "value":435
         },
         {
            "idStore":"426",
            "value":562
         }
      ],
      "label":"8277366 - MESH U BLACK*",
      "id":"mdl_num_modele_r3_detail_term_agg:8277366"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":626
         },
         {
            "idStore":"58",
            "value":289
         },
         {
            "idStore":"243",
            "value":330
         },
         {
            "idStore":"8",
            "value":148
         },
         {
            "idStore":"78",
            "value":124
         },
         {
            "idStore":"539",
            "value":166
         },
         {
            "idStore":"468",
            "value":120
         },
         {
            "idStore":"429",
            "value":270
         },
         {
            "idStore":"426",
            "value":115
         }
      ],
      "label":"8070921 - ARTENGO TB 710",
      "id":"mdl_num_modele_r3_detail_term_agg:8070921"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":620
         },
         {
            "idStore":"243",
            "value":147
         },
         {
            "idStore":"8",
            "value":96
         },
         {
            "idStore":"78",
            "value":153
         },
         {
            "idStore":"539",
            "value":227
         },
         {
            "idStore":"468",
            "value":118
         },
         {
            "idStore":"429",
            "value":201
         },
         {
            "idStore":"426",
            "value":66
         }
      ],
      "label":"8324968 - SOCKS ELIOFEEL INV  BLACK",
      "id":"mdl_num_modele_r3_detail_term_agg:8324968"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":594
         },
         {
            "idStore":"58",
            "value":420
         },
         {
            "idStore":"243",
            "value":385
         },
         {
            "idStore":"8",
            "value":124
         },
         {
            "idStore":"78",
            "value":653
         },
         {
            "idStore":"539",
            "value":688
         },
         {
            "idStore":"468",
            "value":300
         },
         {
            "idStore":"429",
            "value":468
         },
         {
            "idStore":"426",
            "value":229
         }
      ],
      "label":"8124329 - RS750 LOW X3 BLACK",
      "id":"mdl_num_modele_r3_detail_term_agg:8124329"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":566
         },
         {
            "idStore":"58",
            "value":239
         },
         {
            "idStore":"243",
            "value":730
         },
         {
            "idStore":"8",
            "value":666
         },
         {
            "idStore":"78",
            "value":1447
         },
         {
            "idStore":"539",
            "value":390
         },
         {
            "idStore":"468",
            "value":1118
         },
         {
            "idStore":"429",
            "value":616
         },
         {
            "idStore":"426",
            "value":314
         }
      ],
      "label":"8296178 - SOCKS EKIDEN BLACK",
      "id":"mdl_num_modele_r3_detail_term_agg:8296178"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":563
         },
         {
            "idStore":"58",
            "value":425
         },
         {
            "idStore":"243",
            "value":602
         },
         {
            "idStore":"8",
            "value":553
         },
         {
            "idStore":"78",
            "value":900
         },
         {
            "idStore":"539",
            "value":796
         },
         {
            "idStore":"468",
            "value":582
         },
         {
            "idStore":"429",
            "value":925
         },
         {
            "idStore":"426",
            "value":730
         }
      ],
      "label":"3185449 - CONFORT TS SPORTEE WHITE",
      "id":"mdl_num_modele_r3_detail_term_agg:3185449"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":562
         },
         {
            "idStore":"58",
            "value":152
         },
         {
            "idStore":"243",
            "value":622
         },
         {
            "idStore":"8",
            "value":663
         },
         {
            "idStore":"78",
            "value":1065
         },
         {
            "idStore":"539",
            "value":401
         },
         {
            "idStore":"468",
            "value":1043
         },
         {
            "idStore":"429",
            "value":421
         },
         {
            "idStore":"426",
            "value":289
         }
      ],
      "label":"8296177 - SOCKS EKIDEN WHITE",
      "id":"mdl_num_modele_r3_detail_term_agg:8296177"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":549
         },
         {
            "idStore":"58",
            "value":183
         },
         {
            "idStore":"243",
            "value":311
         },
         {
            "idStore":"8",
            "value":116
         },
         {
            "idStore":"78",
            "value":181
         },
         {
            "idStore":"539",
            "value":224
         },
         {
            "idStore":"468",
            "value":95
         },
         {
            "idStore":"429",
            "value":179
         },
         {
            "idStore":"426",
            "value":156
         }
      ],
      "label":"8018454 - 5 BARS 20G OVOMALTINE",
      "id":"mdl_num_modele_r3_detail_term_agg:8018454"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":525
         },
         {
            "idStore":"58",
            "value":387
         },
         {
            "idStore":"243",
            "value":198
         },
         {
            "idStore":"8",
            "value":177
         },
         {
            "idStore":"78",
            "value":211
         },
         {
            "idStore":"539",
            "value":414
         },
         {
            "idStore":"468",
            "value":224
         },
         {
            "idStore":"429",
            "value":263
         },
         {
            "idStore":"426",
            "value":166
         }
      ],
      "label":"5160772 - TIGHTS CLASSIC PINK JR",
      "id":"mdl_num_modele_r3_detail_term_agg:5160772"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":456
         },
         {
            "idStore":"58",
            "value":371
         },
         {
            "idStore":"243",
            "value":442
         },
         {
            "idStore":"8",
            "value":327
         },
         {
            "idStore":"78",
            "value":672
         },
         {
            "idStore":"539",
            "value":661
         },
         {
            "idStore":"468",
            "value":556
         },
         {
            "idStore":"429",
            "value":485
         },
         {
            "idStore":"426",
            "value":534
         }
      ],
      "label":"5156228 - BODY1 LEGGING SALTO BLACK",
      "id":"mdl_num_modele_r3_detail_term_agg:5156228"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":454
         },
         {
            "idStore":"58",
            "value":488
         },
         {
            "idStore":"243",
            "value":579
         },
         {
            "idStore":"8",
            "value":288
         },
         {
            "idStore":"78",
            "value":722
         },
         {
            "idStore":"539",
            "value":800
         },
         {
            "idStore":"468",
            "value":228
         },
         {
            "idStore":"429",
            "value":586
         },
         {
            "idStore":"426",
            "value":536
         }
      ],
      "label":"8321138 - ARTENGO RS700 HIGH X3 WHITE",
      "id":"mdl_num_modele_r3_detail_term_agg:8321138"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":442
         },
         {
            "idStore":"58",
            "value":226
         },
         {
            "idStore":"243",
            "value":293
         },
         {
            "idStore":"8",
            "value":174
         },
         {
            "idStore":"78",
            "value":344
         },
         {
            "idStore":"539",
            "value":392
         },
         {
            "idStore":"468",
            "value":193
         },
         {
            "idStore":"429",
            "value":252
         },
         {
            "idStore":"426",
            "value":476
         }
      ],
      "label":"6171359 - B-SSTS SPORTEE WHITE*",
      "id":"mdl_num_modele_r3_detail_term_agg:6171359"
   },
   {
      "data":[
         {
            "idStore":"90",
            "value":437
         },
         {
            "idStore":"58",
            "value":348
         },
         {
            "idStore":"243",
            "value":205
         },
         {
            "idStore":"8",
            "value":169
         },
         {
            "idStore":"78",
            "value":189
         },
         {
            "idStore":"539",
            "value":348
         },
         {
            "idStore":"468",
            "value":219
         },
         {
            "idStore":"429",
            "value":247
         },
         {
            "idStore":"426",
            "value":195
         }
      ],
      "label":"3801174 - LEATHER PINK 1/2 POINTE SHOES",
      "id":"mdl_num_modele_r3_detail_term_agg:3801174"
   }
]

Column config :

{
      id: dataToHandle[i].idStore,
      header: headerStore,
      kpi: parameters.kpi,
      summarize: Summarizers.meanSummarizer,
      firstSortDirection: SortDirection.Descending,
      bottomDataRender: (object) => {
        if (parameters.percent === '%') {
          return ('100%');
        }
        return object.column.renderer(object.columnSummary.sum);
      },
      value: row => {
        return row.data.filter(rowData => rowData.idStore == dataToHandle[i].idStore).map(rowData => rowData.value)[0];
      },
      sortValue: cellData => parseFloat(cellData),
      sortType: DataType.Number,
      renderer: (parameters.percent === '%') ? numberUtil.formatPercent : numberUtil.formatNombre,
      thClassName: (currentColumnIsSelectedStore) ? 'selected' : '',
      tdClassName: (cellData, object) => {
        var style = '';

        if (cellData == undefined) {
          style = style + 'no-data-cell ';
        }
        if (currentColumnIsSelectedStore) {
          style = style + 'selected ';
        }

        return style;
      },
      tdStyle: (cellData, object) => {
        if (cellData === undefined) {
          return {
            textColor: 'white',
            backgroundColor: 'white',
          };
        }
        if (byRow) {
          return getRgbaHeatmap(cellData, object, parameters.list, parameters.color);
        }
      },
      plugins: {
        heatmap: {
          highlight: 'always',
          colorScheme: (parameters.color === 'blue') ? 'Blues' : 'YlOrRd',
        },

      },
    }

Any idea?

Cheers,

ps : we have some dirty code as well, reworking on it when we can.. :)

[pbeshai]

Hmm, not sure. Could it be maybe that you set sortType and not type on the column? Hard to say without an example in front to try

[clementdevos]

Tried to add the type field on the column but did not work... =/

[pbeshai]

It is weird that it works for the other columns. If there are errors in the console they'd help. I'll see if I can reproduce later today

[pbeshai]

My next guess is that there is a problem when some of the cell data is undefined. It might be breaking the scale.

Can you try replacing

value: row => {
        return row.data.filter(rowData => rowData.idStore == dataToHandle[i].idStore).map(rowData => rowData.value)[0];
      },

with

value: row => {
        return row.data.filter(rowData => rowData.idStore == dataToHandle[i].idStore).map(rowData => rowData.value)[0] || 0;
      },

And see if it fixes it? That would confirm the undefined bug I believe.

[clementdevos]

@pbeshai it works! I'll see with the users if "0" is the same as "undefined" for them :)

Cheers!

[pbeshai]

Thanks, it's a bug I'll look at fixing soon.

[pbeshai]

Fixed in 0.4.1. Null or undefined values are now ignored by the heatmap.