Starting from version 2.9, Flexmonster allows you to share reports.
This guide describes the following:
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:
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.
To share reports, you need Flexmonster Data Server version 2.9 or higher. If you do not have the Data Server, complete this guide: Installing Flexmonster Data Server as a Windows/Unix service.
If you have Flexmonster Data Server version 2.8, see how to update 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.
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" } }
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.
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:
C:/ProgramData/FlexmonsterDataServer/reports/
.~/.local/share/FlexmonsterDataServer/reports/
(will resolve to /home/[current_user]/.local/share/FlexmonsterDataServer/reports/
).0
(reports are stored permanently).0
(unlimited).You may be interested in the following articles: