ActiveUI

ActiveUI

  • User Guide
  • Developer Documentation

›Guides

About

  • Introduction
  • Changelog

Getting Started

  • Step by Step
  • Development Environment
  • Artifacts
  • ActiveUI Application
  • Usage as an npm Dependency
  • Initialization
  • Project Architecture

Guides

  • Adding KaTex fonts
  • Adding Servers
  • Authentication
  • Bookmark favorites
  • Charts
  • Configuring Widget Handlers and Actions
  • Container
  • Custom UI components with Ant Design
  • Data manipulation
  • Debugging
  • Deployment
  • Internationalization
  • MDX Manipulation
  • Plugins
  • Reporting
  • Settings
  • Tabular View and Pivot Tables
  • Testing

Reference

  • API Reference
  • Default Widget Bookmarks
  • Plugins
  • Settings

Advanced

  • Content Server Setup
  • Experimental Features
  • Maven Integration
  • Offline Installation
  • Script-based Integration

Tabular View and Pivot Tables

We recommend reading the documentation about Data and <Container /> before looking at this page.

Configuration

The tabular view / pivot table can be configured through a JavaScript object inside the <Container />'s defaultValue/value prop. The configuration enables you to configure a widget without using UI controls, or sometimes allows you to control options that do not have a UI control. Below, you will see sample code that generates a Tabular View and a Pivot Table using a simple query, but hiding the line numbers shown by default:

const TabularView = () => (
  <Container
    defaultValue={{
      name: 'Tabular View',
      value: {
        body: {
          configuration: {
            tabular: {
              lineNumbers: false,
            },
          },
          mdx: `SELECT FROM [EquityDerivativesCube]`,
        },
        containerKey: 'tabular-view',
      },
    }}
  />
);

const PivotTable = () => (
  <Container
    defaultValue={{
      name: 'Tabular View',
      value: {
        body: {
          configuration: {
            tabular: {
              lineNumbers: false,
            },
            showWizard: true,
            wizard: {},
          },
          mdx: `SELECT FROM [EquityDerivativesCube]`,
        },
        containerKey: 'pivot-table',
      },
    }}
  />
);

Here is a list of configuration attributes for the Tabular View and Pivot Table widget:

keyTypeEffectComment
addButtonFilterStringFilters the fields displayed when clicking on the add buttonOne of [all, literal, numeric, measure]
cellEditorPluginThe cell editor to use (called on cell double-click)
cellRendererPluginThe cell renderer to use for the widget. It will be called for each cell of the table.The default cell renderer is the caption cell renderer
columnOrderArray
columnsArray
columnsGroupsArray
defaultOptionsObjectOptions used by default for the columnsFor example, use the key width to have a default width for each column
handlersPlugin
lineNumbersBooleanTrue to show the line numberstrue by default
minRowSizeNumberMinimum height in pixels for all rows31px by default
rowActionArray[Plugin]The row actions to display in the viewThe are displayed by default at the right end of the widget
rowStyleArray[Plugin]The style to apply to row of the tabular
sortingModeStringThe sorting mode to use for this tabularOne of [breaking, non-breaking]

Note: None of these configuration attributes are necessary to render a widget. They are provided for an advanced configuration of the view.

← SettingsTesting →
  • Configuration
Copyright © 2023 ActiveViam