Globalizing Report
Our sample projects and report templates can help you learn the basics of working with our products.A report can be rendered for a specific culture, formatting numbers, dates and localized text accordingly.
Localization setup. Load the requested culture or localization resource before the report interface and formatted values are produced.
Localization setup. Load the requested culture or localization resource before the report interface and formatted values are produced.
<script setup lang="ts">
import { ref, watch } from 'vue';
import { Viewer, Stimulsoft } from 'stimulsoft-reports-js-vuejs/viewer';
var selectedCountry = ref('en-US');
var report: Stimulsoft.Report.StiReport;
watch(
selectedCountry,
() => {
const locFile = `Localizations/` + selectedCountry.value.substring(0, 2) + '.xml';
Stimulsoft.Base.Localization.StiLocalization.setLocalizationFile(locFile);
report = new Stimulsoft.Report.StiReport();
report.loadFile('Reports/Globalization.mrt');
report.culture = selectedCountry.value;
},
{ immediate: true }
);
</script>
<template>
<div class="container">
<div class="container-control">
<label class="label-globalization">Select Language</label>
<select v-model="selectedCountry" class="select-globalization">
<option value="en-US">English</option>
<option value="de-DE">Deutsch</option>
<option value="pl-PL">Polish</option>
</select>
</div>
<div>
<Viewer :report="report" />
</div>
</div>
</template>report.culture controls culture-dependent formatting, while StiLocalization.setLocalizationFile changes the viewer interface language — together they globalize both the document and the UI.