Extended Chart - Carousel Pixel Point Chart

1. Version

Designer	Extended Chart Plugin Version
10.0	V4.3

2. Application scenarios

A new subtype is added to the Gauge in version 4.3 of the Extended Chart plugin: Pixel Point Chart.

This chart is applicable to large-screen scenarios and can be used to display multiple percentage data in rotation or monitor percentage changes in real time, for example, monitor CPU and memory usage in real time. The effect is shown below:

3. Function introduction

• Supports data rotation and periodic refresh.

• Chart styles allow you to set title, label, graphics, and background.

• Supports custom rotation interval, with a lower limit of 4 seconds.

• Support for showing negative percentages, but no highlighted pixel graphics.

• Supports chart linkage and component refresh. For details, see Chart Manual Refresh.

4. Install the plugin

Click to download the plugin: Extended Chart

Designer plugin installation method reference: Plugin Management

Server installation plugin method reference: Server plugin management

5. Chart entry

In the Chart Type, added a Pixel Point Chart under the Extended Chart - Gauge, which can be optionally inserted into the report.

1. Data

Percentage calculation logic: Indicator Value/Target Value, Target Value can also be set to Automatic, and set a target value to participate in the calculation by default when you choose Automatic.

2. Style

Graphics settings can customize the representation of pixels.

This parameter is used to set the color of pixel. The color of pixel varies with the percentage range.

• Auto: The default interval configuration is divided into 3 partitions, as shown in the following figure:

• Custom: Users can set up a maximum of 6 partitions by themselves. You need to customize the left and right ranges and colors of each partition, as shown in the following figure:

Here you can set the number and interval of pixel.

• Points per row: The number of pixels in a row. Manual input is not supported.

• Pixel Fill: Sets the effect of the pixel fill component.

• Point gap: The distance between pixels. You can enter it manually.

When users select One-way Fill, the proportion of pixel remains unchanged and a certain direction will be selected to fill according to the width and height of the component. The effect is shown in the figure below:

When users select Two-way Fill, the components will be filled with pixel horizontally and vertically, as shown below:

There are two animation effects for pixel loading, which are as follows:

• In Order

• Out of Order

3. Special effect

In the special effect section, you can set Refresh, Carousel Interval and Carousel Linkage, as shown in the following figure:

1. Data preparation

Create a general report and a built-in dataset. Here, three pieces of data are set to simulate real-time memory changes. In actual scenarios, users can enable periodic refresh to monitor, as shown in the following figure:

2. Insert the chart

Merge a region cell and insert the Pixel Point Chart, as shown below:

3. Bind the data

Bind the data to the chart, as shown below:

4. Config the partition

Customize the interval and the corresponding pixel color, and select One-way Fill for the pixel, as shown in the figure below:

5. Preview effect

Save the report, and click "Pagination Preview", the effect is as shown below:

Note: The mobile terminal is not supported.

Please refer to the completed template: %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc-EN\Primary\Chart\Pixel_Point_Chart.cpt

Click to download: Pixel_Point_Chart.cpt