This example illustrates how to load a font file, add it to the report resources, and render the report. First of all, you should add Stimulsoft modules to the project. To do this, just use one universal package, all other dependencies will be loaded automatically:
var Stimulsoft = require('stimulsoft-reports-js');
console.log("Stimulsoft Reports loaded");

Next, create a new StiReport object - just call the constructor of the object:
var report = new Stimulsoft.Report.StiReport();

Now you should load a font file and add it to the report resources. A special StiResource object is designed for this. The object can contain any supported file types - data, images, fonts, other reports, and etc. As parameters of the constructor, specify the name and alias of the resource, its type and the previously loaded font. Then just add it to the resource collection, and all is ready:
var fileContent = Stimulsoft.System.IO.File.getFile("Roboto-Black.ttf", true);
var resource = new Stimulsoft.Report.Dictionary.StiResource(
    "Roboto-Black", "Roboto-Black", false, Stimulsoft.Report.Dictionary.StiResourceType.FontTtf, fileContent);
report.dictionary.resources.add(resource);

To check how the font works, add a text component to the report page using the code, and use this font in the component parameters. To do this, just specify the resource name in the font property, all further actions will be performed by the report engine:
//Create text
var dataText = new Stimulsoft.Report.Components.StiText();
dataText.clientRectangle = new Stimulsoft.System.Drawing.Rectangle(1, 1, 3, 2);
dataText.text = "Sample Text";
dataText.font = new Stimulsoft.System.Drawing.Font("Roboto-Black");
dataText.border.side = Stimulsoft.Base.Drawing.StiBorderSides.All;

page.components.add(dataText);

To render a report, call the asynchronous renderAsync() method, which will perform all the necessary actions. Also, you can specify a callback function in the method arguments, which will be called after rendering:
// Renreding report
report.renderAsync(function () {
    console.log("Report rendered. Pages count: ", report.renderedPages.count);

    // Saving rendered report to file
    report.saveDocumentFile("Report.mdc");
    console.log("Rendered report saved");
});

In the screenshot below you can see the result of the sample code:

Adding a Font to the Resource

By using this website, you agree to the use of cookies for analytics and personalized content. Cookies store useful information on your computer to help us improve efficiency and usability. For more information, please read the privacy policy and cookie policy.