ActiveReportsJS: What's New in Version 4.1

No page layout---both local designer and online designer are version 4.1 CRACK

ActiveReportsJS now supports creating reports without pages . This new layout type provides an alternative to traditional page-by-page report formats by presenting report content across separate tabs. Pageless layouts also allow for scrollable containers to simplify user interaction. This feature enhances the flexibility of report design with ActiveReportsJS, providing a user-friendly approach to building and navigating reports. ActiveReportsJS is a reporting solution for visualizing data in front-end applications. The product includes a stand-alone multi-platform designer application that allows report templates to be built using a rich set of controls

custom code

ActiveReportsJS now supports custom functions in report expressions. This feature enhances the flexibility of report design, provides an efficient way to manage complex calculations, reuse code, and facilitate advanced conditional formatting. Here are some ways you can benefit from this feature:

Complex calculations : While ActiveReportsJS expressions can efficiently handle simple to moderately complex calculations, you may encounter business requirements that require more complex calculations. Custom code can simplify these scenarios, providing elegant solutions to complex mathematical operations beyond the capabilities of standard expressions.
Code reusability : If you find yourself using similar code snippets in multiple expressions in your reports, custom code can provide a more efficient approach. By defining the function once, you can call it from various places in the report. This practice not only enhances the maintainability of the code, but also contributes to cleaner report design.
Advanced Conditional Formatting : While basic conditional formatting can be managed using expressions, custom code goes a step further and accommodates more complex scenarios that require dynamic styling based on specific conditions.

For example, in our runtime filtering demo , we utilize a custom function to format currency values based on their magnitude. The function is defined as follows:

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);
    }
}

In a report, text boxes that display numeric values call this function through an expression, for example:

{Code.formatCurrencyValue(Sum(SalesAmount))}

This elegant approach allows dynamic formatting of monetary values based on their magnitude, improving the readability and interpretability of the data.

To learn more about incorporating custom code into ActiveReportsJS projects, see our in-depth guide . Here you'll find detailed information and practical examples to help you get the most out of this powerful feature.

Parameter view

We have now integrated a new feature that allows custom parameter views to be created using the advanced editor. This enhancement accommodates various parameters such as Date Range, , , etc., allowing more general control over the data Slider.ListBox

Additionally, we have updated the parameters documentation to include comprehensive guidance. This guide provides detailed instructions on how to effectively design and utilize parameters in reports, and outlines the steps to build custom views.

Chart Report Items

new drawing type

We've added four new plot types to the Data Visualization Toolbox: Ranged Column , Ranged Bar , Ranged Area , and Gauge .

Range Column and Bar Charts

Range column and bar charts and plots are great for showing the difference between the minimum and maximum values for each category (represented by vertical or horizontal bars). This chart type can be used to visualize data such as temperature ranges, price fluctuations, or other scenarios where the focus is on the range between two values.

range area chart

Range area charts are designed to show the range or difference between two sets of values for a continuous variable, such as time. This chart type consists of two lines representing the upper and lower limits, and fills the area between the lines to emphasize the range. Range area charts are often used to display data such as sales forecasts with confidence intervals, temperature ranges over time, or stock price fluctuations.

instrument diagram

Gauge charts , also known as speedometer or dial charts, are suitable for visualizing individual data points within a specified range, usually in relation to a goal or goals. These graphs are especially useful when you want to communicate progress or performance in a visually appealing way.

A recently added Text Encodingfeature provides the ability to implement advanced configurations for plot labels and tooltips. See Customizing Tooltips and Labelsthe subsections under specific plot types for more information. For example, you can view column and bar charts .

Configurable bar lines for column and bar charts

You can now customize the color, width, and style of the lines connecting bars or columns in the graph.

interactive legend

Chart color, shape or size legends can now be interactive , enabling report readers to click a legend item to jump to another report, open a dynamic URL or apply parameters.

Different kinds

Data Handling Improvements

We have improved the data processing in ActiveReportsJS, mainly using the asynchronous API to obtain report data. This enhancement not only improves the user experience, but also allows developers to use service workers to intercept data requests. As a result, developers can manage these requests directly in the application code, giving them full control over data processing. Note that while the synchronous XHR API is still used in some scenarios, these instances are now very rare.

group index function

You can now use the GroupIndex function to retrieve the index of a grouped instance. This feature is especially useful when customizing the style of grouped items at runtime. In particular, it can be used to set alternating background colors for a more visually organized and attractive display. For example, in the simple table demo , the background color of the text box in the detail row is determined by an expression {IIF(GroupIndex() Mod 2 = 0, "White", "#f8f8f8")}. This expression alternates the background color between white and light gray ( ) using GroupIndexa function of the retrieved index . The table's Details group is set to the value of the only field in the dataset, in this case . Since the StartTime is unique for each taxi driver, it effectively groups each driver into a distinct entity. Therefore, when previewing the report, the detail rows display alternating background colors to enhance readability, and each taxi trip is visually separated by color.Details group#f8f8f8StartTime

Custom date parameter format

You can now set and parameters Formatto customize how parameter values look in date input boxes in the parameters panel

Do you know what's new in ActiveReportsJS 4.1? Crack