asked on September 10, 2024
When we try moving rows to be columns and columns to be rows often we end up with the situation when some labels just turn into broken image icons. Is it possible to fix? Some screenshots are attached. We are not sure if its related to our customizeCell function, so just in case here it is:
customizecellfunction: function (cell, data, rawdata) {
if (!(data.hierarchy && data.hierarchy.uniqueName == "structureimage")) return;
if (data && data.type == "header" && data.label != "") {
let base64Img;
cell.addClass("fm-custom-cell");
if (data.expanded) {
base64Img = `<i class="fm-icon fm-expanded-icon" title="Click to collapse"></i>
<img src='data:image/png;base64, ${data.label}'/>`;
} else {
base64Img = `<i class="fm-icon fm-collapsed-icon" title="Click to expand"></i>
<img src='data:image/png;base64, ${data.label}'/>`;
}
cell.text = `<div style="display:flex; align-items:center; font-size:12px; position:relative;">
${base64Img}</div>`;
}
}
⋅ September 12, 2024
Hello,
Thank you for reaching out to us.
We could not reproduce the described behavior on our side. Please check the following JSFiddle: https://jsfiddle.net/flexmonster/2z6nk4dr/. It seems that images are shown as expected when switching rows and columns. Kindly edit the example to show us the issue. It would greatly help us.
Looking forward to hearing from you.
Kind regards,
Nadia
⋅ September 12, 2024
The example rows can't be expanded/collapsed to show first column images, maybe that's why its not showing up there. I am using the following functions to set up slice rows:
getrows: function (d) {
var me = this;
return [{ uniqueName: me.getentitycolname(d) }, { uniqueName: "structureimage" }];
},
getentitycolname: function (d) {
var entitycol = d.columns.find(function (col) { return col.key == "compoundid" });
return entitycol.label.toLowerCase();
},
report: {
slice: {
rows: this.getrows(ret)
⋅ September 13, 2024
Hello,
Thank you for providing us with the details.
We were able to reproduce the described behavior. To avoid this issue, we recommend checking if the cell is not a measure by adding the following code to your customizeCell function:
if (!(data.hierarchy && data.hierarchy.uniqueName == "structureimage") || data.measure) return;
You are welcome to check the following example for reference: https://jsfiddle.net/flexmonster/cuqg5xwh/.
Please let us know if it works for you. Looking forward to hearing from you.
Kind regards,
Nadia
⋅ September 17, 2024
Thank you! It resolved the issue!
⋅ September 18, 2024
Hello,
Thank you for the feedback.
We are glad to hear that it works for you.
You are welcome to contact us if other questions arise.
Kind regards,
Nadia