Skip to main content

Localize texts in a report

Overview

JSReport supports report generation in multiple languages. This how-to will deal with the generation of a report in 3 languages (as an example) - English, Finnish and Swedish.

Setting up translations

In the folder setup for the report, add a new "sample-data" file. The naming of the file follows a standard convention → "xx-data" (where xx is the 2-digit language code, for example "en" for English, "fi" for Finnish, "sv" for Swedish etc. See the full list of ISO codes here)

2183397563.png

This is a JSON data file, and it must contain everything is proper JSON structure (https://www.w3resource.com/JSON/structures.php). All language data files must contain the same structure. Only values will be different, and translated to that particular language.

In example below, we have a dataset in 3 languages. It contains basic information like language name, code and page Title. Other than that, we added a set of field-names which can be used as headers in a table to display portfolio information.

en-data

{
        "lang": "English",
        "langCode": "en",
        "title": "Report",
    "portfolioFields": {
        "id": "ID",
        "shortName": "Short Name",
                "name": "Name",
                "currency": "Currency",
                "country": "Country"
    }
}

fi-data

{
        "lang": "Suomi",
        "langCode": "fi",
        "title": "Salkut",
    "portfolioFields": {
        "id": "ID",
        "shortName": "Lyhyt nimi",
                "name": "Nimi",
                "currency": "Valuutta",
                "country": "Maa"
    }
}

sv-data

{
        "lang": "Sverige",
        "langCode": "sv",
        "title": "Portföljer",
    "portfolioFields": {
        "id": "ID",
        "shortName": "Kort Namm",
                "name": "Namm",
                "currency": "Valuta",
                "country": "Land"
    }
}

Once these files are created, we can use them in our template. In order to link data-files to the template, we need specifically attach these files to the template by adding them under "resources".

"Resources" is found under "Properties" panel. Click "select..." and tick all the language data-files. (It is important that there must be only one file per language)

2183397560.png

Using translations in a report

In the following example of a simple template that information about portfolios: we have added custom variables which picks the required value in correct language. These variables begin with "$localizedResource".

JSReport replaced the variable "$localizedResource" with correct data file depending on language choice. Beyond that, JSReport searches for the datafile for matching key or fields and fills in the corresponding values.

Testing the translations

In order to test the localisation, the user can type the language code under "resources" section under "Properties" panel.

In the below example, typing "fi" as default language will build the report using values from the "fi-data" file.

2183397557.png