Share the report

Starting from version 2.9, Flexmonster allows you to share reports.

This guide describes the following:

The idea of the report-sharing feature
How to share the report
Where to configure report sharing

Note In Flexmonster, you can also save, export, or print your report.

Let’s assume you have configured a report in Flexmonster and want to show the result to your team. It is possible with the report-sharing feature.

Its idea is the following:

Flexmonster Data Server is needed for report sharing. This server-side tool is responsible for saving and loading reports.
When the user shares a report, Flexmonster saves this report to the Data Server and provides a link to the saved report.
When the link is opened in the browser, Flexmonster loads the report from the Data Server. As a result, the component will visualize the shared report.

To demonstrate how report sharing works, we added this feature to our main demo. Feel free to try: click the Share tab, copy the provided link, and send it to your teammates. If they follow your link, they will see our demo with your report. Note that in this case, reports will be saved to the Data Server configured on our side.

Now let’s see how to add the report-sharing feature to your project.

Step 1. Install Flexmonster Data Server

To share reports, you need Flexmonster Data Server version 2.9 or higher. If you do not have the Data Server, complete this guide: Getting started with Flexmonster Data Server.

If you have Flexmonster Data Server version 2.8, see how to update the Data Server.

Step 2. Specify a path to the Data Server

Flexmonster requires the Data Server’s URL to save and load the shared report.

Ways to specify the URL depend on the data source used on your page.

Flexmonster Data Server

If you use Flexmonster Data Server as a data source, the component saves and loads reports using the URL from the dataSource.url property:

report: {
  dataSource: {
    type: "api",
    // this URL will be used to share reports
    url: "http://localhost:9500",
    index: "sample-index"
  }
}

Another data source

If you use any other data source, you need to specify the Data Server’s URL in the shareReportConnection.url property. This URL will be used to load and save the shared reports. For example:

let pivot = new Flexmonster({
  container: "pivotContainer",
  componentFolder: "node_modules/flexmonster/",
  report: {
    dataSource: {
      filename: "data.json"
    }
  },
  shareReportConnection: {
    // a URL to the Data Server
    url: "http://localhost:9500"
  }   
});

For convenient report sharing, there is a Share tab on the Toolbar. By default, it is hidden. To show the Share tab, handle the beforetoolbarcreated event as follows:

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

Now you can share your report by clicking on the Share tab:

Alternatively, you can implement your custom control using the shareReport API call:

<button onclick="flexmonster.shareReport()">Share the report</button>

<script>
  let pivot = new Flexmonster({
    container: "pivotContainer",
    componentFolder: "node_modules/flexmonster/",
    report: {
      dataSource: {
        filename: "data.json"
      }
    },
    shareReportConnection: {
      // a URL to the Data Server
      url: "http://localhost:9500"
    }
  });
</script>

Once called, the shareReport method saves the report to the Data Server and opens a pop-up window with a link to the saved report. You can copy that link and share it.

Step 4. Open the shared report

Now users can open the link you have shared in the browser to see your report. Note that the Data Server should be accessible to the people you share the report with.

You can configure the report-sharing functionality using Flexmonster Admin Panel. Open it, go to the Settings tab, and scroll down to the Report sharing settings block.

The Report sharing settings block allows configuring the report-sharing functionality. Have a look at the configurations it provides:

Endpoint. Indicates whether the endpoint to share reports is enabled in the Data Server. Default value: Disabled.
Custom path to folder. This configuration is available only when the endpoint is enabled. Defines the folder to which the Data Server saves reports. By default, reports are saved to the following locations:
- On Windows - C:/ProgramData/FlexmonsterDataServer/reports/.
- on macOS and Ubuntu/Linux - ~/.local/share/FlexmonsterDataServer/reports/ (will resolve to /home/[current_user]/.local/share/FlexmonsterDataServer/reports/).
Report expiration time. Defines how long the saved reports are stored. The time is set in minutes. Default value: 0 (reports are stored permanently).
This configuration is available only when the endpoint is enabled.
Max folder size. The maximum memory size available for report saving (in MB). Default value: 0 (unlimited).
This configuration is available only when the endpoint is enabled.
Auto delete. Should be used with the Max folder size configuration. Defines whether to delete older reports when the folder is full. If enabled, older reports will be deleted automatically until there is enough memory for a new report. Default value: Disabled (older reports are not deleted).
This configuration is available only when the endpoint is enabled.

What’s next?

You may be interested in the following articles:

Share the report

The idea of the report-sharing feature

How to share the report