Export to image issue

Answered
Yegor asked on February 3, 2023

Hello,
After update from v. 2.9.21 to v. 2.9.43 we found problem with export as image, it doesn't apply our custom styles to table in exported image. Font size and font color styles are not applied to table in exported image. Also when we use custom font-family or font-size styles header is shifted and bigger than table in exported image. 

3 answers

Public
Nadia Khodakivska Nadia Khodakivska Flexmonster February 6, 2023

Hello, Yegor,

Thank you for reaching out to us.

We could not reproduce the described behavior on v. 2.9.43 of Flexmonster. You are welcome to check the following JSFiddle: https://jsfiddle.net/flexmonster/b8v3oxft/. It seems that the export to image includes the font style. 
Kindly note that if you use a bigger font size, it is necessary to change the cell's height. For example, the default cell height is 30px, and the font size is 12px. So it means that if the user sets a font size, for example, to 16px, the height should be:

16*(30/12) = 16*2,5 = 40px 

This way, you can calculate the necessary cell height depending on the font size: 

:root {
  --font-size: 16px;
}

#fm-pivot-view .fm-ui div {
  font-size: var(--font-size) !important;
}

#fm-pivot-view .fm-grid-row {
  min-height: calc(var(--font-size)*2.5) !important;
}

If you still face the issue, please edit the JSFiddle example above to show us the described behavior.

Also, could you please let us know if you already have Flexmonster license? This will help us to better analyze your use case based on our internal records.

Looking forward to hearing from you.

Kind regards,
Nadia

Public
Yegor February 6, 2023

Hello, I found what was causing issue, styles are no applied for cases where selector contains custom .class
Example: .data-pivot #fm-pivot-view .fm-ui div{}
.data-pivot is div with pivot.
In old flexmonster versions such styles were applying to exported image.
Thanks.

Public
Nadia Khodakivska Nadia Khodakivska Flexmonster February 6, 2023

Hi, Yegor,

Thank you for the feedback.

As always, feel free to contact us in case other questions arise.

Kind regards,
Nadia

Please login or Register to Submit Answer