Wyn Enterprise Integration API
This page provides the API required to integrate the report designer, report viewer, dashboard designer, and dashboard viewer components into your web applications.
Installation
To install the latest release version:
npm install @grapecity/wyn-integrationImport
Using the package name
import { WynIntegration } from "@grapecity/wyn-integration";Use source code for this package
import { WynIntegration } from "@grapecity/wyn-integration/index";Usage
Add Dashboard Designer to <div id="wyn-root">
import { WynIntegration } from "@grapecity/wyn-integration";
WynIntegration.createDashboardDesigner({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
defaults: {
dashboardId: 'e9ab2113-32bd-403e-9f0a-eb2b0438f864',
lng: 'en',
},
}, '#wyn-root').then(ins => {
});Add Dashboard Viewer to <div id="wyn-root">
import { WynIntegration } from "@grapecity/wyn-integration";
WynIntegration.createDashboardViewer({
baseUrl: 'http://sample.com',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
defaults: {
dashboardId: '0bead052-d56a-4fac-897b-a2984c0208e3',
theme: 'red',
},
}, '#wyn-root').then(ins => {
});Add Dashboard Lite Viewer to <div id="wyn-root">
import { WynIntegration } from "@grapecity/wyn-integration";
WynIntegration.createViewerLite(
{
baseUrl: 'http://sample.com',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
defaults: {
dashboardId: '0bead052-d56a-4fac-897b-a2984c0208e3',
},
}, '#wyn-root').then(ins => {
});Add Report Designer to <div id="wyn-root">
import { WynIntegration } from "@grapecity/wyn-integration";
WynIntegration.createReportDesigner({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
reportId: '1a8bbca0-51a9-4eb3-b42e-ff1f7b0f4b75',
}, '#wyn-root').then((ins) => {
});Add Report Viewer to <div id="wyn-root">
import { WynIntegration } from "@grapecity/wyn-integration";
WynIntegration.createReportViewer({
baseUrl: 'http://sample.com',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
reportId: '0ddb33e9-3211-4d96-9d25-ca34458dd8b9',
}, '#wyn-root').then(ins => {
});Add Dataset/DataSource, Designer/Viewer, or semantic designer to <div id="wyn-root">
import { WynIntegration } from "@grapecity/wyn-integration";
WynIntegration.createDatasetDesigner({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
type: 'dashboard',
}, '#wyn-root').then(ins => {
});
WynIntegration.createDatasetViewer({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
documentId: '840fac96-abac-4276-8fb5-051eb07c95df',
}, '#wyn-root').then(ins => {
});
WynIntegration.createDatasourceDesigner({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
}, '#wyn-root').then(ins => {
});
WynIntegration.createDatasourceViewer({
baseUrl: 'http://sample.com',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
documentId: '8ce06a89-85f9-4756-b052-fb3d7c832899',
}, '#wyn-root').then(ins => {
});
WynIntegration.createSemanticDesigner({
baseUrl: 'http://sample.com',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
}, '#wyn-root').then(ins => {
});Add PushDataset/PushDataset designer to <div id="wyn-root">
WynIntegration.createPushDatasetDesigner({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
type: 'dashboard',
}, '#wyn-root').then(ins => {
});
WynIntegration.createStreamingDatasetDesigner({
baseUrl: 'http://sample.com/',
token: 'd3ecc751b250f8129e87f6813c13ee7ec0bf1f01198160f3bdddb6771c20fab9',
theme: 'default',
language: 'zh',
siteTitle: 'sds',
type: 'dashboard',
}, '#wyn-root').then(ins => {
});