All documentation
  • Introduction
  • Connecting to data source
    1. Supported data sources
    2. Connecting to other data sources
  • Browser compatibility
  • Documentation for older versions
  • Referencing the Accelerator as a DLL

    Flexmonster Accelerator can be integrated into your website back end as a separate ASP.NET controller. The main benefits of referencing the Accelerator as a DLL directly from the ASP.NET project are:

    • No running of Accelerator installers.
    • Easy updates to the newest version.
    • No firewall settings.
    • No service dependencies.

    Prerequisites

    • Microsoft Analysis Services installed and configured
    • Microsoft .NET Standard 2.0 or higher
    • Visual Studio IDE

    Step 1. Embed the component into your webpage

    If Flexmonster is not yet embedded, set up an empty component in your webpage:

    In pure JavaScript

    Complete the Integrating Flexmonster guide. Your code should look similar to the following example:

    let pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "node_modules/flexmonster/",
      toolbar: true
    });

    In React

    Complete the Integration with React guide. Your code should look similar to the following example:

    <FlexmonsterReact.Pivot
     toolbar={true}
    />

    In Angular

    Complete the Integration with Angular guide. Your code should look similar to the following example:

    <fm-pivot
     [toolbar]="true">
    </fm-pivot>

    In Vue

    Complete the Integration with Vue guide. Your code should look similar to the following example:

    <Pivot
     toolbar
    />

    Step 2. Configure Flexmonster Accelerator on the server

    Choose one of the following options:

    Integrate Flexmonster Accelerator into an existing project

    To integrate Flexmonster Accelerator into an existing project, follow these steps:

    Step 1. Install the Accelerator with NuGet – Visual Studio's package manager:

    • Right-click on the project and select the Manage NuGet Packages item:
      How to find the Manage NuGet Packages item
    • In the Browse tab, search for the Flexmonster.Accelerator package and install it:
      We show how to find the Flexmonster.Accelerator package and install it

    Step 2. Create a FlexmonsterConfig class with information about the connection:

    ParameterDescription
    ConnectionStringThe connection string for Microsoft Analysis Services. Example: Data Source=localhost;.
    CacheManager.EnabledIndicates whether the cache is enabled.
    CacheManager.MemoryLimitThe maximum memory size available for caching (in bytes).

    Your code should look similar to the following:

    public class FlexmonsterConfig {
      public static void Register() {
        // Replace with actual data source 
        // Example: Data Source=localhost
        Flexmonster.Accelerator.Controllers.FlexmonsterProxyController
        .ConnectionString = "Data Source=localhost";
    
        Flexmonster.Accelerator.Utils.CacheManager
        .MemoryLimit = 10 * 1024 * 1024; // MB to bytes
    
        Flexmonster.Accelerator.Utils.CacheManager.Enabled = true;
      }
    }

    In our project, this file is located in the Flexmonster Accelerator MVC/App_Start/ folder.

    Note: to connect to Azure Analysis Services, specify AuthHelper in FlexmonsterConfig. This property is an instance of the AzureAuthHelper class that has the following parameters:

    ParameterDescription
    ResourceURLThe URL of your Azure Analysis Services instance. Must be specified as https://<domain name>, where <domain name> is the region from the data source specified in the connection string. Example: https://aspaas.asazure.windows.net.
    AzureAuthorityThe Azure authority URL (e.g., https://login.microsoftonline.com/<your_domain>). Learn more in the Microsoft guide.
    AzureClientIdThe client ID of the service principal registered in Azure Active Directory.
    AzureClientSecretThe client secret of the service principal registered in Azure Active Directory.

    Here's a code example:

    public class FlexmonsterConfig {
      public static void Register() {
        // Replace with actual data source 
        // Example: Data Source=asazure://aspaas.asazure.windows.net/myserver
        Flexmonster.Accelerator.Controllers.FlexmonsterProxyController
        .ConnectionString = "Data Source=asazure://aspaas.asazure.windows.net/myserver";
     
        // AuthHelper for Azure Analysis Services
        Flexmonster.Accelerator.Controllers.FlexmonsterProxyController
        .AuthHelper = new AzureAuthHelper(
          // ResourceURL
          /* Must match the region from the data source
          specified in the ConnectionString */
          "https://aspaas.asazure.windows.net",
          // AzureAuthority
          "https://login.microsoftonline.com/<your_azure_domain>",
          // AzureClientId 
          "00000000-0000-0000-0000-000000000000",
          // AzureClientSecret 
          "XXXXXXXXXXXXX" 
        );
      }
    }

    Step 3. Register FlexmonsterConfig inside the Application_Start method of the Global.asax.cs file:

    FlexmonsterConfig.Register();

    Step 4. Create an AcceleratorController class that extends FlexmonsterProxyController. This class will handle the requests to the Accelerator:

    public class AcceleratorController : 
    Flexmonster.Accelerator.Controllers.FlexmonsterProxyController {
    public override void OnRequest(BaseArgs args) {
    base.OnRequest(args);
    }
    }

    In our project, this file is located in the Flexmonster Accelerator MVC/Controllers/ folder.

    Step 3. Configure the component

    Now it’s time to configure the client - Flexmonster Pivot Table and Charts. Let’s create a minimal configuration using the JavaScript API (replace proxyUrl, catalog and cube parameters with your specific values):

    Connect to a multidimensional model

    let pivot = new Flexmonster({
      container: "pivotContainer",
      componentFolder: "node_modules/flexmonster/", 
      toolbar: true,  
      report: { 
        dataSource: { 
          type: "microsoft analysis services", 
    
          /* URL to Flexmonster Accelerator */ 
          proxyUrl: "http://localhost:50005", 
    
          /* Catalog name */ 
          catalog: "Adventure Works DW Standard Edition", 
                
          /* Cube name */ 
          cube: "Adventure Works", 
                    
          // Flag to use the Accelerator instead of XMLA protocol binary 
          binary: true 
        } 
      }
    }); 

    Connect to a tabular model

    let pivot = new Flexmonster({
      container: "pivotContainer", 
      componentFolder: "node_modules/flexmonster/",
      toolbar: true,  
      report: { 
        dataSource: { 
          type: "microsoft analysis services", 
    
          /* URL to Flexmonster Accelerator */ 
          proxyUrl: "http://localhost:50005", 
    
          /* Database name */ 
          catalog: "Adventure Works DW Standard Edition", 
                
          /* Model name */ 
          cube: "Adventure Works", 
                    
          // Flag to use the Accelerator instead of XMLA protocol binary 
          binary: true  
        } 
      } 
    });  

    Launch the webpage from a browser — there you go! A pivot table is embedded into your project.

    Enable logging

    By default, logging is disabled in the Accelerator as a DLL. To enable logging, you need to implement the Flexmonster.Accelerator.Utils.ILogger interface:

    Step 1. In your project, create a C# class (e.g., MyLogger.cs).

    Step 2. Open the created file (e.g., MyLogger.cs) and import Flexmonster.Accelerator.Utils:

    using Flexmonster.Accelerator.Utils;

    Step 3. Implement the Flexmonster.Accelerator.Utils.ILogger interface by implementing the Error, Info, Trace, and Warn methods. Your code should look similar to the following:

    using Flexmonster.Accelerator.Utils;
    
    namespace Project_Namespace
    {
    	public class MyLogger : ILogger
    	{
    		public void Error(string message)
    		{
    			System.Diagnostics.Debug.WriteLine(message);
    		}
    
    		public void Error(string message, params object[] args)
    		{
    			System.Diagnostics.Debug.WriteLine(message);
    		}
    
    		/* Info, Trace, and Warn methods can be implemented similarly */
    	}
    }
    

    Notice that the Error method is overloaded, so it is implemented twice. The same applies to Info, Trace, and Warn methods. Overall, you should have eight methods implemented in your class.

    Step 4. Go to the FlexmonsterConfig class and add your logger implementation to the Register method:

    namespace Project_Namespace
    {
    	public class FlexmonsterConfig
    	{
    		public static void Register()
    		{
    			// Other code
    			Flexmonster.Accelerator.Utils.LoggerLocator.SetLogger(new MyLogger());
    			// Other code
    		}
    	}
    }

    Now logging is enabled for the Accelerator as a DLL.

    What’s next?

    You may be interested in the following articles: