Setup and Configuration (Web)

Prerequisites

The Reveal Server SDK requires .NET Core 2.2+ or .NET Framework 4.6.2 ASP MVC application projects.

In case you are targeting .NET Framework 4.6.2+, the Reveal Server SDK supports a win7-x64 runtime environment. To debug your web project you need to add a win7-x64 compatible RuntimeIdentifier platform:

<PropertyGroup>

   <TargetFramework>net462</TargetFramework>

   <RuntimeIdentifier>win7-x64</RuntimeIdentifier>

</PropertyGroup>

Setup and Configuration (Server)

To set up the Reveal Web Server SDK you need to:

  1. Add references to assemblies and install dependency packages.

  2. Define the Server Context.

  3. Initialize the Server SDK.

  4. Enable server-side screenshot generation.

1. Getting Assemblies and Dependency Packages ready

To add references to assemblies and install dependency packages we recommend using NuGet package manager. The easiest way to setup your project is installing Reveal.Sdk.Web.AspNetCore (Trial) NuGet package.

After installing the Reveal SDK, you should be able to find a new NuGet package source added to your nuget.config called Infragistics (Local) that points to “%public%\Documents\Infragistics\NuGet”.

addingNugetPackage_web

After ensuring you have the Infragistics (Local) feed properly configured by the installer, you need to:

  • install the Reveal.Sdk.Web.AspNetCore NuGet package to your application project.
  • add a NuGet package reference to System.Data.SQLite version 1.0.111+

If you are having issues with the build, follow this link.

2. Defining the Server Context

After referencing the required DLLs, you need to create a class that implements the IRevealSdkContext interface. This interface allows the Reveal SDK to run inside of your host application and provides callbacks for working with the SDK.

using Reveal.Sdk;
public class RevealSdkContext : IRevealSdkContext
{
    public IRVDataSourceProvider DataSourceProvider => null;

    public IRVDataProvider DataProvider => null;

    public IRVAuthenticationProvider AuthenticationProvider => null;

    public async Task<Stream> GetDashboardAsync(string dashboardId)
    {
        return await Task.Run(() =>
        {
            //load a .rdash file as a stream and return it
            var fileName = $"C:\\Temp\\{dashboardId}.rdash";
            return new FileStream(fileName, FileMode.Open, FileAccess.Read);
        });
    }

    //This callback is used only when “onSave” event is not installed on the
    //RevealView object client side. For more information see the web client SDK documentation
    public async Task SaveDashboardAsync(string userId, string dashboardId, Stream dashboardStream)
    {
        //Save edited dashboard here
        await Task.Run(() => { });
    }
}

The implementation above will load dashboards from “C:\Temp” folder, looking for a .rdash file that depends on the dashboardId variable. In your application, you may want to change this to load dashboards from another directory, from the database, or even from an embedded resource.

Note

Properties returning null: The first three properties, DataSourceProvider, DataProvider, and AuthenticationProvider, are all implemented to return null. In this guide you can find information about how to implement each of the interfaces for these properties, so they will no longer be implemented to return null.

3. Initializing the Server SDK

In the Startup.cs, in the ConfigureServices method of the application, call the services extension method AddRevealServices, passing in the _RevealEmbedSettings__ class.

The AddRevealServices extension method is defined in the Reveal.Sdk namespace, so you will need to add a using directive. In addition, you also need to set the CachePath property as shown below.

services.AddRevealServices(new RevealEmbedSettings
{
    LocalFileStoragePath = @"C:\Temp\Reveal\DataSources",
    CachePath = @"C:\Temp"
}, new RevealSdkContext());
Note

LocalFileStoragePath is only required if you are using local Excel or CSV files as dashboard data source, and the RevealSdkContext class implements IRevealSdkContext as described before.

Finally, you need to add Reveal endpoints by calling the AddReveal extension method when adding MVC service. Similar to the following code snippet:

services.AddMvc().AddReveal();

Like AddRevealServices, the AddReveal method is defined in the Reveal.Sdk namespace, so you need a using directive too.

4. Enabling server-side screenshot generation

In order to use the export to image functionality (either programmatically or through user interaction), you need to perform the steps below:

  1. Get the following three files from <InstallationDirectory>\SDK\Web\JS\Server:

    • package.json
    • packages-lock.json
    • screenshoteer.js
  2. Copy the files to the root level of your project (parent folder of "wwwroot").

  3. Make sure you have npm (the package manager for Node.js) installed.

If you don’t need the export to image functionality, you don’t need to copy the files to your projects. However, when trying to build the project, it will fail complaining that it cannot find npm.

To solve this error, add the following property to your project:

<PropertyGroup>
  <DisableRevealExportToImage>true</DisableRevealExportToImage>
</PropertyGroup>

Build Issues using NuGet

To handle a deployment issue related to SQLite.Interop.dll, custom .targets file are used in the NuGet package.

If you are having build issues, you can disable this behavior by adding the following property to your project:

<DisableSQLiteInteropFix>true</DisableSQLiteInteropFix>

Setup and Configuration (Client)

To set up the Reveal Web Client SDK you need to:

  1. Check Dependencies.

  2. Reference the Web Client SDK.

  3. Instantiate the Web Client SDK.

1. Checking Dependencies

The Reveal Web Client SDK has the following 3rd party references:

2. Referencing the Web Client SDK

Enabling $.ig.RevealView component in a web page requires several scripts to be included. These scripts will be provided as part of Reveal Web Client SDK.

<script src="~/Reveal/infragistics.reveal.js"></script>

JavaScript files can be found in "<InstallationDirectory>\SDK\Web\JS\Client".

3. Instantiating the Web Client SDK

Reveal’s Dashboard presentation is handled natively through the Web Client SDK.

To get started follow these steps:

  1. Define a <div /> element with “id” and invoke the $.ig.RevealView constructor.

    Note

    Hosting Client-Side and Server-Side Parts Separately If you want to host client-side and server-side parts on different servers, please read here before you continue to next step.

  2. Call $.ig.RVDashboard.loadDashboard providing the dashboardId and success and error handlers.

  3. In the success handler instantiate the $.ig.RevealView component by passing a selector for the DOM element where the dashboard should be rendered into. Finally you should use the retrieved dashboard and set it to the dashboard property of the $.ig.RevealView

Sample Code

<!DOCTYPE html>
<html>
  <head>
    ⋮
    <script type="text/javascript">
      var dashboardId = "dashboardId";

      $.ig.RVDashboard.loadDashboard(
        dashboardId,
        function (dashboard) {
          var revealView = new $.ig.RevealView("#revealView");
          revealView.dashboard = dashboard;
        },
        function (error) {
          //Process any error that might occur here
        }
      );
    </script>
  </head>
  <body>
    <div id="revealView" style="height:500px;" />
  </body>
</html>