README

Wyn Report Viewer

How to install

npm install @grapecity/wyn-report-viewer

How to include

Bundle location: ./node_modules/@grapecity/wyn-report-viewer/dist

Using the physical path:

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

Using the package name:

import "@grapecity/wyn-report-viewer/dist/viewer-app.js";
import "@grapecity/wyn-report-viewer/dist/viewer-app.css";

Using the attributes main and style from package.json:

import "@grapecity/wyn-report-viewer";

How to use

Add this snippet to <body> after <script> with viewer-app.js:

<div id="report-viewer-app"></div>

<script type="text/javascript">

  var portal = { url: '<portalUrl>', username: '<username>', password: '<password>' };
  var reportId = '<reportId>';

  function createViewerApplication(portalUrl, referenceToken) {
    var viewer = GrapeCity.WynReports.Viewer.create({
      element: 'report-viewer-app',
      portalUrl: portalUrl,
      referenceToken: referenceToken,
    });

    viewer.openReport(reportId);
  }

  GrapeCity.WynReports.getReferenceToken(portal.url, portal.username, portal.password)
    .then(function(referenceToken) {
      createViewerApplication(portal.url, referenceToken);
    });

</script>