Runtime Filtering

The interactive action known as Apply Parameters empowers report authors to configure runtime filters, enabling report readers to manipulate and examine data in a slice-and-dice fashion. In this demonstration, the Sales Dashboard exhibits how users can zoom in on specific years and locations. This approach enables users to focus on the desired information and tailor their analysis to meet their needs.

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <title>ActiveReportsJS sample</title> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" href="https://cdn.materialdesignicons.com/5.4.55/css/materialdesignicons.min.css" /> <link rel="stylesheet" type="text/css" href="https://cdn.mescius.com/activereportsjs/5.latest/styles/ar-js-ui.css" /> <link rel="stylesheet" type="text/css" href="https://cdn.mescius.com/activereportsjs/5.latest/styles/ar-js-viewer.css" /> <link rel="stylesheet" type="text/css" href="https://cdn.mescius.com/activereportsjs/5.latest/styles/ar-js-designer.css" /> <link rel="stylesheet" type="text/css" href="/activereportsjs/demos/resource/common/report-sample-style.css" /> <script src="/activereportsjs/demos/resource/common/init-report-sample.js"></script> <script src="https://cdn.mescius.com/activereportsjs/5.latest/dist/ar-js-core.js"></script> <script src="https://cdn.mescius.com/activereportsjs/5.latest/dist/ar-js-viewer.js"></script> <script src="https://cdn.mescius.com/activereportsjs/5.latest/dist/ar-js-designer.js"></script> <script src="https://cdn.mescius.com/activereportsjs/5.latest/dist/ar-js-pdf.js"></script> <script src="https://cdn.mescius.com/activereportsjs/5.latest/dist/ar-js-html.js"></script> <script src="https://cdn.mescius.com/activereportsjs/5.latest/dist/ar-js-tabular-data.js"></script> <script src="$DEMOROOT$/lib/purejs/license.js"></script> </head> <script> function onLoad() { function formatCurrencyValue(value) { let currencySymbol = "$"; if (value >= 1000000000) { return currencySymbol + (value / 1000000000).toFixed(1) + "B"; } else if (value >= 1000000) { return currencySymbol + (value / 1000000).toFixed(1) + "M"; } else if (value >= 1000) { return currencySymbol + (value / 1000).toFixed(1) + "K"; } else { return currencySymbol + value.toFixed(1); } } MESCIUS.ActiveReportsJS.Core.CustomCode.registerFunctions([ { name: "FormatCurrencyValue", body: formatCurrencyValue, info: { description: "Format a number to currency in relation to their magnitude", example: "Code.numberToWords(Sum(SalesAmount))", syntax: "Code.numberToWords(<number>)", }, }, ]); var paramsOpened = false; initReportSample( "viewer-host", "designer-host", "SalesDashboard3.rdlx-json", "Runtime Filtering", function (viewer) { // viewer.toggleToolbar(false); // viewer.toggleSidebar(false); // viewer.toggleFullScreen(); viewer.zoom = "FitPage"; } ); } </script> <body onload="onLoad()"> <div id="root"> <div id="viewer-host"></div> <div id="designer-host"></div> </div> </body> </html>