@grapecity/ar-viewer-ja
v18.1.1
Published
Fast, full featured, JavaScript report viewer for ActiveReports report definition files. Features include printing, exporting, and searching.
Downloads
108
Readme
ActiveReports Js Viewer
How to install
npm i @grapecity/ar-viewer-jaHow to include
The bundles are here: ./node_modules/@grapecity/ar-viewer-ja/dist
Using the physical path:
<head>
...
<link
href="./node_modules/@grapecity/ar-viewer-ja/dist/jsViewer.min.css"
rel="stylesheet"
/>
...
</head>
<body>
...
<script
type="text/javascript"
src="./node_modules/@grapecity/ar-viewer-ja/dist/jsViewer.min.js"
></script>
...
</body>Using the package name:
import '@grapecity/ar-viewer-ja/dist/jsViewer.min.js';
import '@grapecity/ar-viewer-ja/dist/jsViewer.min.css';Using attributes main and style from package.json:
import '@grapecity/ar-viewer-ja';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"
}
}
}`),
});