We have updated Flexmonster Software License Agreement, effective as of September 30, 2024. Learn more about what’s changed.

Date fields are shown as numbers even though mapping is set

Answered
Nikita asked on April 3, 2024

I have such values in a field - 2024-04-01 but it is always shown as a single number 2024. Is there a way to show it as a full date? Also, if we have more than 1 value for the field, can the values be shown comma-separated or it will always just be count of values? There can be null values, so I tried enforcing the type with the mapping:

getmapping: function (d) {
var mapping = {};
d.columns.forEach(function (col) {
if (!col.groupby && !scil.Utils.isNullOrEmpty(col.protocolid)) {
if (col.type == "float")
mapping[col.label] = { type: "number" };
else if (col.type == "date")
mapping[col.label] = { type: "date string" };
else if (col.type == "text")
mapping[col.label] = { type: "string" };
}
});
return mapping;
},

14 answers

Public
Maksym Diachenko Maksym Diachenko Flexmonster April 5, 2024

Hello, Nikita!

Thank you for writing to us.

This issue is probably caused by the mapping not being applied to the field containing dates. In such cases, Flexmonster assigns the default date type, which composes three hierarchical values for year, month, and day, as happens with the "Date1" field in this example: https://jsfiddle.net/flexmonster/6u2ngx5o/ 
We suggest printing the report retrieved with Flexmonster's getReport method and checking if the mapping is applied on a corresponding date field and the type is set to "date string".
Also, please note that Flexmonster does not support containing multiple comma-separated values in a single field.

Looking forward to hearing your feedback.

Best Regards,
Maksym

Public
Nikita April 5, 2024

I checked and the date is correctly set as "date string" but still shows incorrectly. Also, another field - ADME Assay/Admin Route - is set as "string" but it shows as count 1 and even when I click on the cell with 1 it still shows 1 instead of showing the value in the cell.
Wouldn't it work to just use customizeCell function to manually set comma-separated values for the fields that contain that data? 

Attachments:
flexview_date_type.png

Public
Maksym Diachenko Maksym Diachenko Flexmonster April 8, 2024

Hello, Nikita!

Thank you for sharing more details with us.

From the provided screenshot, it looks like the mapping was set correctly. Yet, we were unable to reproduce the incorrect behavior when only the year is shown from a "date string" hierarchy. Could you please provide a reproducible code example where a field with a "date string" type is displayed as a year? 

Also, please note that only numeric values are supported in Flexmonster. Hence, when the string field is selected as a measure, the count is displayed as a default aggregation. Due to cell objects not saving the information about the strings from which the count value is composed, the workaround with customizeCell would not be possible to implement.

Looking forward to hearing from you.

Best Regards,
Maksym

Public
Maksym Diachenko Maksym Diachenko Flexmonster April 24, 2024

Hello, Nikita!

Hope you are doing well.
We are wondering if you were able to find the solution for the issue with mapping.
Please let us know if further assistance is needed.

Best Regards,
Maksym

Public
Nikita April 24, 2024

Hi Maksim,

We were able to just always show 'count', then use complex customizeCell function to show in parentheses the individual values for string types. We were not yet able to show dates correctly and most probably will need to format them manually too in customizeCell. Currently I am not working on the issues, but within 2 weeks will come back to it.

Thank you,

Nikita

Public
Maksym Diachenko Maksym Diachenko Flexmonster April 25, 2024

Hello, Nikita!

Thank you for the reply.

We are glad you could implement the desired functionality for displaying string individual values. Speaking of the issue with displaying dates, we strongly recommend finding a solution to format them with mapping instead of using the customizeCell for date formatting. While the dates formatted this way may look correct, all the Flexmonster's aggregations and operations, like filtering and sorting, still rely on real cell data. This would cause inconsistency between labels and results of any operation.

Our team is ready to help with further research, so we kindly request you to provide a full runnable sample where the mentioned wrong mapping behavior can be reproduced. This would help us to identify the issue and provide a solution for it. Additionally, we have prepared an example with dates formatted as "YYYY-MM-DD" both in measure and members area: https://jsfiddle.net/flexmonster/ug91pn0x/ 

Our team is looking forward to hearing from you.

Best Regards,
Maksym

Public
Nikita June 20, 2024

I was working on the issue further and found that when the first element in the data array is an actual date, then dates are shown correctly, but when it is null, - the type of the field is set as number which is causing the issue. I can't seem to be able to explicitly set the data type, could you help with that?

getmeasures: function (d) {
var aggbycols = d.columns.filter(function (col) { return !col.groupby && col.key != "compoundid" });
return aggbycols.map(function (col) {
var measureobj = { uniqueName: col.key.includes("reg-") ? col.key : col.label.toLowerCase(), active: true };
if (col.type == "float")
measureobj["aggregation"] = "average";
else if (col.type == "date" || (col.key.includes("reg-") && col.key.toLowerCase().includes("date")))
measureobj["aggregation"] = "max";
else
measureobj["aggregation"] = "count";
return measureobj;
});
},

getmapping: function (d) {
var mapping = {
resultid: {
type: "id"
}
};
d.columns.forEach(function (col) {
if (!col.groupby) {
if (col.type == "float")
mapping[col.label] = { type: "number" };
else if (col.type == "date")
mapping[col.label] = { type: "date string" };
else if ((col.key.includes("reg-") && col.key.toLowerCase().includes("date")))
mapping[col.key] = { type: "date string" };
/*else if (col.type == "date")
mapping[col.label] = { type: "date string" };
else if (col.type == "text")
mapping[col.label] = { type: "string" };*/
}

});

return mapping;
},

Public
Nikita June 20, 2024

I checked both functions and they do provide 'max' as aggregation and 'date string' for the type for dates in mapping. However, flexmonster does not listen to these explicit specifications.

Public
Nikita June 20, 2024

Here is how I am defining flexview:

```
me.flexview = new Flexmonster({
container: divflex,
componentFolder: "https://cdn.flexmonster.com/",
//licenseKey: "Z71X-XAAB4Q-045773-4D350T",
toolbar: true,
customizeCell: (cell, data) => scil.Registration.FlexViewer.customizecellfunction(cell, data, ret.data),
report: {
dataSource: {
data: ret.data
},
mapping: scil.Registration.FlexViewer.getmapping(ret),
slice: {
columns: scil.Registration.FlexViewer.getcols(ret),
rows: scil.Registration.FlexViewer.getrows(ret),
measures: scil.Registration.FlexViewer.getmeasures(ret)
}
}
});
```

Public
Maksym Diachenko Maksym Diachenko Flexmonster June 21, 2024

Hello, Nikita!

Thank you for your reply.

Kindly note that the mapping object is specified in the report.dataSource object, not inside the report object. Here is an example of how to set the mapping object correctly:

report: {
dataSource: {
mapping: {
"Date2": {
type: "date string",
caption: "Date (date string)"
},
"Date3": {
type: "datetime",
caption: "Date (datetime)"
}
}
}
}

Refer to this JSFiddle as a working code example: https://jsfiddle.net/flexmonster/6u2ngx5o/

Hope this helps.

Best Regards,
Maksym

Public
Nikita June 21, 2024

Thank you!

I tried it now like that:

me.flexview = new Flexmonster({
container: divflex,
componentFolder: "https://cdn.flexmonster.com/",
toolbar: true,
customizeCell: (cell, data) => scil.Registration.FlexViewer.customizecellfunction(cell, data, ret.data),
report: {
dataSource: {
data: ret.data,
mapping: scil.Registration.FlexViewer.getmapping(ret)
},
slice: {
columns: scil.Registration.FlexViewer.getcols(ret),
rows: scil.Registration.FlexViewer.getrows(ret),
measures: scil.Registration.FlexViewer.getmeasures(ret)
}
}
});

But the issue is still there. mapping object looks like:

{
  TonyTestProtocol/CustomDate: {type'date string'}
  TonyTestProtocol/IC50: {type'number'}
  TonyTestProtocol/R2: {type'number'}
  reg-date: {type'date string'}
  resultid: {type'id'}
}

'reg-date' stays as 'date string' but 'TonyTestProtocol/CustomDate' is switched to 'number' type. I have also tried manually specifying the mapping in place instead of using the function but the result stays the same.

Public
Nikita June 21, 2024

The issue happens only when the first value in the data array for the key is null. If its a real date - everything works fine, but it looks as if mapping object is just ignored and Flexmonster implicitly determines types.

Public
Nikita June 21, 2024

Found the issue: keys should be all lowercased. I made a mistake of not having same keys across mapping and uniqueName in other objects. Thank you! Its working fine now.

Public
Maksym Diachenko Maksym Diachenko Flexmonster June 24, 2024

Hello, Nikita!

Thank you for your reply.
We are glad to hear that you resolved the issue with setting date types via mapping.
Please let us know if any other questions arise.

Best Regards,
Maksym

Please login or Register to Submit Answer