IE Compatibility

GoJS
#1

Hi,
We are giving most of font-size in REM but for IE Browser it is not excepting for GOJS Element.
Can you suggest any alternative for same.
Please Find Below code for your reference:

go.TextBlock,
{
    ....
    ....
    font: '0.625rem Poppins',
},

It is working in Chrome but not in IE.

#2

Even font-family is not getting applied in IE.

I have tried providing font-size in ‘px’ at that time font-size is reflecting but but still font-family is not getting applied.

Note: We wanted to use REM so that it supports responsiveness.
If I cant use REM is there any way through which I can achieve responsiveness.

#3

Exactly which responsive situations do you want to handle?

#4

Font-size will be different for Desktop, mobile, ipad, Larger Screens(with width resolution >1900px)

#5

GoJS automatically takes the screen resolution (pixels per inch) into account. The actual window size doesn’t matter – only the size of the HTMLDivElememt that is hosting the Diagram controls the size of the viewport.

You or the user can control the Diagram.scale, which is independent of the page zoom. You could also set https://gojs.net/latest/api/symbols/Diagram.html#defaultScale

#6

And what about font-family…?
It is getting applied in Chrome but not in IE or Edge

#7

How are you loading that font? Is that supported by IE or legacy Edge?

#8

Yes It is supported in IE, have also cross-verified it.
It is getting applied elsewhere, only in GOJS Diagram it is not reflecting

FYI I am using GOJS inside Angular.

#9

Maybe there’s a timing problem. Have you tried rendering the diagram only after you know that the font has been loaded?

#10

Yes Font is already loaded before drawing the diagram

#11

How do you know that the font has been loaded?

GoJS calls CanvasRenderingContext2D.fillText to draw text,

#12

We are using same font across project.
And GoJs Diagram Screen is not loaded until some is navigating to that page.
And on very first page I have verified that font is loaded.
Meanwhile I will look into CanvasRenderingContext2D.fillText as well

#13

It appears that using a rem font size does not work on HTML Canvases in both Internet Explorer and Edge. We cannot do anything about this unfortunately.

Otherwise, the Poppins font seems to work: https://codepen.io/simonsarris/pen/wvMEWzX?editors=1010

#14

Thank you Simon…
I have got an alternative for rem, but yes, I will check for Poppins font.