Creating pivot tables with nebula
The pivot table presents dimensions and measures as rows and columns in a table. In a pivot table you can analyze data by multiple measures and in multiple dimensions at the same time.
// Configure nucleus
const nuked = window.stardust.embed(app, {
context: {
constraints: {
active: false, // allow interactions, default is false
},
},
types: [
{
name: 'pivot-table',
load: () => Promise.resolve(window['sn-pivot-table']),
},
],
});
// Rendering a pivot table
nuked.render({
type: 'pivot-table',
element: document.querySelector('.table'),
fields: ['Alpha', 'Dim1', '=Sum(Expression1)'],
},
});More examples
You can customize the pivot table. Here are some basic examples.
Pivoting data
When you want to rearrange your data you can set properties that defines if a dimension should be positioned as a row or a column.
This is done using the qNoOfLeftDims property. It specifies how many
of the dimensions that should be rows.
nuked.render({
element: document.querySelector(".object"),
type: "pivot-table",
properties: {
qHyperCubeDef: {
qDimensions: [
{
qDef: {
qFieldDefs: ["Dim1"],
},
},
{
qDef: {
qFieldDefs: ["Dim2"],
},
},
],
qMeasures: [
{
qDef: {
qDef: "Sum(Expression1)",
},
},
],
qInitialDataFetch: [
{
qLeft: 0,
qTop: 0,
qWidth: 50,
qHeight: 50,
},
],
qMode: "P",
qNoOfLeftDims: 1,
},
},
});Measure grouping
Multiple measure in the pivot table are always grouped together. This group of measures can be pivoted just like dimensions and positioned either as a row or a column.
To pivot the measure group use the qInterColumnSortOrder and position
the -1 value. Note that qNoOfLeftDims defines if the measure group
is positioned as a row or a column.
nuked.render({
element: document.querySelector(".object"),
type: "pivot-table",
properties: {
qHyperCubeDef: {
qDimensions: [
{
qDef: {
qFieldDefs: ["Dim1"],
},
},
{
qDef: {
qFieldDefs: ["Dim2"],
},
},
],
qMeasures: [
{
qDef: {
qDef: "Sum(Expression1)",
},
},
{
qDef: {
qDef: "Sum(Expression2)",
},
},
{
qDef: {
qDef: "Sum(Expression3)",
},
},
],
qInitialDataFetch: [
{
qLeft: 0,
qTop: 0,
qWidth: 50,
qHeight: 50,
},
],
qMode: "P",
qNoOfLeftDims: 2,
qInterColumnSortOrder: [0, -1, 1],
},
},
});