Miss any of our Open RFC calls?Watch the recordings here! »

@grapecity/ar-viewer

14.1.2428 • Public • Published

ActiveReports Js Viewer

How to install

npm i @grapecity/ar-viewer --save-dev

How to include

The bundles are here: ./node_modules/@grapecity/ar-viewer/dist

Using the physical path:

<head>
  ...
  <link href="./node_modules/@grapecity/ar-viewer/dist/jsViewer.min.css" rel="stylesheet">
  ...
</head>
<body>
  ...
  <script type="text/javascript" src="./node_modules/@grapecity/ar-viewer/dist/jsViewer.min.js"></script> 
  ...
</body>

Using the package name:

import "@grapecity/ar-viewer/dist/jsViewer.min.js";
import "@grapecity/ar-viewer/dist/jsViewer.min.css";

Using attributes main and style from package.json:

import "@grapecity/ar-viewer";

How to use

<body>
  ...
  <div id="viewerContainer" />
  ...
  <script type="text/javascript">
    let viewer;
    function loadViewer() {
        viewer = GrapeCity.ActiveReports.JSViewer.create({
        element: '#viewerContainer'
        });
    }  
    loadViewer();
    viewer.openReport('report.rdlx');
  </script> 
  ...
</body>

Localization

JSViewer automatically detects the user's language and supports English, Japanese, and Chinese localizations.

To add custom localization to JSViewer, specify the URL of the JSON file containing the localization data:

GrapeCity.ActiveReports.JSViewer.create({
  element: '#viewerContainer',
  localeUri: './custom-locale.json'
});

Or pass the JSON object directly:

GrapeCity.ActiveReports.JSViewer.create({
  element: '#viewerContainer',
  localeData: JSON.parse(`{
      "export": {
        "boolTextFalse": "False",
        "boolTextTrue": "True"
      },
      "viewer": {
        "toolbar":
        {
          "refresh": "Refresh"
        }
      }
    }`
  ),
});

Keywords

none

Install

npm i @grapecity/ar-viewer

DownloadsWeekly Downloads

199

Version

14.1.2428

License

Commercial

Unpacked Size

904 kB

Total Files

7

Last publish

Collaborators

  • avatar