Force mashup to use Qlik sense font on unicodes / chr

[cpomeren003]

Hi everyone,

I am currently using some chr() / Unicodes inside my mashup map object, the problem is these chr() / unicodes default to the windows image of the chr() / unicode instead of the qlik sense image. The thing is, I like the qlik sense images better (they are cleaner).

Problem in pictures:

How it looks in Qlik sense:

How it looks inside my mashup:

If you search for "hot beverage" here:
https://unicode.org/emoji/charts/full-emoji-list.html

You will recognize the windows picture from the second example.

So I now know that it's using windows image and I need to change it back to the Qlik Sense image. I tried placing around with @fontface inside css, something like this:

@font-face {

font-family: "Lui-Icons";

src: url('\fonts\lui-icons.woff') format('woff');

font-weight: normal;

font-style: normal;

}

@font-face {

font-family: "QlikView Sans";

src: url(\fonts\qlikview-sans.ttf') format('truetype');

font-weight: normal;

font-style: normal;

}

.body {

font-family: Lui-Icons;

}

The problem is, neither font-family Lui-Icons or QlikView Sans works. Does anyone know how to fix this?

Any help is appreciated.

[ErikWetterberg]

Hi,

You do load Qlik Sense style sheets in your mashup?? Have you tried a CSS rule that matches your icon elements and has font-family: "QlikView Sans".

Erik Wetterberg

[cpomeren003]

Hi Erik,

You do load Qlik Sense style sheets in your mashup??

I load this Qlik Sense stylesheet:

<link rel="stylesheet" href="../../resources/autogenerated/qlik-styles.css">

I don't load in the .woff or .tff inside my html.

Have you tried a CSS rule that matches your icon elements and has font-family: "QlikView Sans".

The icon elements are inside this html (canvas of the map object, can't go down any lower):

<canvas class="idevio-map-canvas" tabindex="0" width="651" height="811" style="position: absolute; left: 0px; top: 0px;"></canvas>

And already has this css applied to it:

.qv-object * {

   font-family: QlikView sans-serif;

}

This originates from the qlik-styles.css stylesheet.

If you need any other information please let me know.

Casper

[cpomeren003]

After a lot of trying and failing I just figured out that Internet Explorer 11 does show the correct visuals (shows qlik sense font). On the other hand both Google Chrome as Mozilla Firefox don't show the correct visuals (show standard windows font).

Anyone have any idea what causes this difference?

[cpomeren003]

Ok, it gets even weirder. After a lot of trying I have made a new discovery:

On a Windows 7 Ultimate pc it shows the correct display (the non-windows one) on both Internet Explorer 11 and Google Chrome;

On a Windows 10 Enterprise laptop it shows the correct display (the non-windows one) on only Internet Explorer 11. On Google Chrome it shows the windows font.

So now the question is, what is the difference between these Windows versions that causes this?