Changing the grid layout

This guide shows how to switch between Flexmonster layouts and describes their differences.

By default, Flexmonster displays data in the compact form. You can also use the classic pivot table and the flat table to analyze data from different angles.

In addition, Flexmonster provides built-in interactive charts. Learn more in the Flexmonster Pivot Charts guide.

How to change the layout

Via UI

Step 1. Select Options on the Toolbar. As a result, the Layout options pop-up window will appear.

Step 2. In the pop-up window, choose the layout from the Layout section:

Step 3. Select the Apply button to see the changes.

In the Layout options pop-up window, you can also manage how grand totals and subtotals are shown.

In the report

To predefine a grid layout in the report, specify the options.grid.type property:

report: {
  dataSource: {
    filename: "data/data.csv"
  },
  options: {
    grid: {
      type: "classic"
    }
  }
};

Live example

Learn about other available grid options.

Using API calls

To change the grid layout at runtime, use the setOptions() method. Your code should look similar to the following:

pivot.setOptions({
  viewType: "grid",
  grid: {
    type: "classic"
  }
});

pivot.refresh();

Live example

Compact form

In Flexmonster, data is displayed in the compact form by default. Learn how this layout works:

• When multiple fields are in rows, expanded row members are displayed under the parent member in the same column, without being transferred to a separate column.
• When column field members are expanded, they are rendered in a separate row.
• The drill-down feature for multilevel hierarchies works the same as the expand feature.
• Subtotals are displayed in the row or column of a parent member when its children are expanded. See how to configure subtotals.
• Grand totals for columns are shown in a row at the bottom of the table, and grand totals for rows are in a column at the end of the table. See how to configure grand totals.
• Grand totals are calculated using the same aggregation function as the corresponding measure.

Check out our compact form live demo.

Classic (tabular) form

The classic pivot table layout is for users who prefer an Excel-like layout of fields. See the key features of the classic layout:

• When members of a field in the rows are expanded or drilled down, they are shown in a separate column.
• When field members in the columns are expanded or drilled down, they are placed in a separate row.
• Subtotals for columns are shown in the parent member's column when its children are expanded.
• Subtotals for rows are displayed in a separate row.
• You can manage which subtotals are displayed.
• Grand totals for columns are displayed at the bottom of the table in a separate row, and grand totals for rows are at the end of the table in a separate column. See how to configure which grand totals are shown.
• Grand totals are calculated using the same aggregation function as the corresponding measure.

See the classic view demo.

Note The header area in the classic form is frozen and can not be scrolled. If your report contains many expanded fields or deep multilevel hierarchies in rows, the frozen area may occupy too much space, and the values may not be visible:

Such a configuration may complicate the work with Flexmonster, so we recommend switching to the compact form.

Flat form

The flat table represents the dataset in its original structure. It is the most basic layout. Check out the key characteristics of the flat view:

• Each field is displayed in a separate column.
• Data is presented in non-aggregated form.
• Grand totals are displayed in the first row of the table only for the measures. You can move grand totals to the bottom of the table or turn them off completely.
• For measures, you can change the aggregation used for calculating grand totals.

Check out our live demo with a flat table.

Note Since the flat table displays non-aggregated data, performance may decrease when connecting to large datasets. In such cases, consider switching to the compact or classic (tabular) pivot layout.

See also

• Choose fields for the grid
• Managing Flexmonster’s functionality
• Сustomizing Flexmonster