<!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>