(Showing Draft Content)


ActiveReportJS Localization module

ActiveReportsJS provides the localization module that includes translations of the Report Viewer UI text to English(en), Japanese(ja), and Chinese(zh) languages. You can find this module in the dist\locales folder of the download package In addition, the localization module is distributed within @grapecity/activereports-localization package

Importing Report Viewer Localization module

In pure JavaScript applications the localization module can be referenced with script tag, for example:

<script type="text/javascript" src="scripts/ar-js-locales.js"></script>

In applications that use JavaScript modules, you can import the localization module from @grapecity/activereports-localization package, for example:

import "@grapecity/activereports-localization";

Setting Report Viewer UI language

In pure JavaScript applications, the ActiveReports.Viewer constructor accepts options as the second parameter, the UI language can be set with these options, for example:

var viewer = new ActiveReports.Viewer("#viewer-host", { language: "ja" });

Check Pure JavaScript page for more information on using ActiveReportsJS in pure JavaScript applications.

Suppose an application is using React, Angular, or Vue Report Viewer components. In that case, you can set the language via the language property of the corresponding component. For example, here is the code that sets the Chinese language for the React Viewer component:

import { Viewer as ReportViewer } from "@grapecity/activereports-react";
import "@grapecity/activereports/styles/ar-js-viewer.css";
import "@grapecity/activereports-localization";

function App() {
  return (
    <div className="App">
      <div id="viewer-host">
        <ReportViewer language="zh" />

Check Angular Component, React Component, and Vue Component pages for more information on how to use Report Viewer in Angular, React, and Vue applications respectively.