Stimulsoft Reports.JS是一個使用JavaScript和HTML5生成報表的平臺。它擁有所有擁來設(shè)計，編輯和查看報表的必需組件。該報表工具根據(jù)開發(fā)人員數(shù)量授權(quán)而不是根據(jù)應(yīng)用程序的用戶數(shù)量。

立即點擊下載Stimulsoft Reports.JS最新版

本示例說明了如何加載字體文件，將其添加到報表資源以及呈現(xiàn)報表。首先，您應(yīng)該將Stimulsoft模塊添加到項目中。為此，只需使用一個通用軟件包，所有其他依賴項將自動加載：

var Stimulsoft = require('stimulsoft-reports-js');
console.log("Stimulsoft Reports loaded");

接下來，創(chuàng)建一個新的StiReport對象，只需調(diào)用該對象的構(gòu)造函數(shù)即可：

var report = new Stimulsoft.Report.StiReport();

現(xiàn)在，您應(yīng)該加載字體文件并將其添加到報表資源中。為此專門設(shè)計了一個StiResource對象。該對象可以包含任何受支持的文件類型：數(shù)據(jù)、圖像、字體、其他報告等。作為構(gòu)造函數(shù)的參數(shù)，指定資源的名稱和別名、資源的類型以及先前加載的字體。然后將其添加到資源集合中，一切就緒：

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);

要檢查字體的工作方式，請使用代碼在報告頁面中添加文本組件，然后在組件參數(shù)中使用此字體。為此，只需在font屬性中指定資源名稱，報表引擎將執(zhí)行所有其他操作：

//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);

要呈現(xiàn)報表，請調(diào)用異步renderAsync()方法，該方法將執(zhí)行所有必要的操作。另外，您可以在方法參數(shù)中指定一個回調(diào)函數(shù)，該函數(shù)將在渲染后調(diào)用：

// 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");
});

在下面的屏幕截圖中，您可以看到示例代碼的結(jié)果：

下載示例代碼

| | |