Custom font not visible in report html5viewer

1 Answer 194 Views
General Discussions Report Viewer - ASP.NET Report Viewer - HTML5
WoorimartDEV
Top achievements
Rank 1
Iron
Iron
WoorimartDEV asked on 04 Aug 2023, 04:04 AM | edited on 04 Aug 2023, 07:01 AM

Hello

First of all, I apologize for the wrong title. I can't fix it
It's about print preview, not html5viewer.

I was going to edit it, but the title isn't working. I'm sorry.

I'm currently using Kendo Report for my company internal project.
It consists of ASPNET CORE MVC, and if requested by the user, it is displayed in html5 viewer.
I installed the font on the server where the Report Server is located and saw it as an html5 viewer because I had to change the font in a specific project, but the font was not recognized normally.
It's actually a font called HY GunGothic, and it's automatically changed to MalgunGothic.
I installed the HY GyunGothic font on the computer on the corresponding Report Server and even rebooted it, but the result was the same.

In the second way, I thought that using private fonts can apply the font regardless of whether the font is on the Host Machine or not,
I modified the web.config file of the project as follows.

[web.config]

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <Telerik.Reporting>
    <privateFonts>
      <add fontFamily="NanumSquareRoundEB" path="~/Fonts/NanumSquareRoundEB.ttf" fontStyle="Regular"/>
    </privateFonts>
  </Telerik.Reporting>
  <system.webServer>
    <handlers>
      <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
    </handlers>
    <aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" forwardWindowsAuthToken="false" hostingModel="InProcess" />
  </system.webServer>
</configuration>

 

and create the StyleSheet.css file at the root of the project
I did the following.

[StyleSheet.css]

body {
}

@font-face {
    font-family: 'NanumSquareRoundEB';
    src: url('Fonts/NanumSquareRoundEB.ttf');
}

 

Also, the cshtml file in Views is as follows.

[Print.cshtml]

@{
    ViewData["Title"] = "POP PRINT";
}
<style>
    #reportViewerLayout {
        position: fixed;
        left: 0px;
        right: 0px;
        top: 0px;
        bottom: 0px;
        overflow: hidden;
        font-family: 'Arial';
    }
</style>
<link href="~/StyleSheet.css" rel="stylesheet" />
<div id="reportViewerLoading">
    Loading...        
</div>
<script type="text/javascript">
    $(document).ready(function () {
        $("#reportViewerLayout")
            .telerik_ReportViewer({

...

However, the result is that the font is broken as follows.
It came out normally in ReportDesigner, but strangely, it comes out like that in Html5Viewer.

[In ReportDesigner]

I thought it was a broken phenomenon (in my case, it's Korean) in a specific language, so I changed it to English and did it again, but the font is not applied anymore.

[Report Preview in Html5Viewer]

[Print Preview in Html5Viewer]

So here's the summary.

1. ReportServer installed and booted a font file on a computer distributed with IIS, but the font was applied by replacing it with Malgun Gothic, the default Korean font for Windows, instead of the Nanum Square RoundEB font for .trdp
2. The font file was inserted into the project by applying private fonts, but in English, the font is applied by changing to Malgun Gothic, the basic Korean font in Windows, and the letters are broken when used in Korean
3. And for now, it looks normal on html5viewer, but I don't know why print preview is different.
I saved it as a pdf file just in case, but the letters are saved in the same broken form.


I bought a license and am using it now, is there any additional part I need to buy to use the font?
I'm taking a lot of time to solve that part.

If there is a sample project that customizes the font of the Telerik Report among the ASP NET CORE projects, please let me know.


 

1 Answer, 1 is accepted

Sort by
0
Momchil
Telerik team
answered on 08 Aug 2023, 12:55 PM

Hello Doyeong,

Generally, installing the font on the machine used to process and render the reports should be enough to get the fonts working correctly.

However, it often helps to install the fonts for all users in case the IIS User the application runs under does not have the required permissions. 

I am attaching a couple of screenshots that illustrate what the result looks like on my end after installing the font you provided.

Regarding the privateFonts approach you tried. It is a valid option indeed, but I do not see a declaration for the Telerik.Reporting section in the web.config file you shared. Did you omit this section from the snippet for brevity or is it missing? If it is missing, please try adding it to see if the private fonts are resolved correctly.

Last but not least, you can try embedding the fonts in the generated PDF files as described in the third option of the Characters are not rendered correctly in PDF files KB article.

I hope this information helps you get the fonts working.

Best Regards,
Momchil
Progress Telerik

Stay tuned by visiting our roadmap and feedback portal pages, enjoy a smooth take-off with our Getting Started resources, or visit the free self-paced technical training at https://learn.telerik.com/.
WoorimartDEV
Top achievements
Rank 1
Iron
Iron
commented on 11 Aug 2023, 08:56 AM

Thank you for your reply. Let's take a look at what you said with reference.
Tags
General Discussions Report Viewer - ASP.NET Report Viewer - HTML5
Asked by
WoorimartDEV
Top achievements
Rank 1
Iron
Iron
Answers by
Momchil
Telerik team
Share this question
or