Context
Context is a very important concept in ReportSheet, as it will filter the data for all the child cells by default, and will also affect the report layout. All of the child cells will repeat with the context cell.
Description
app.js
index.html
styles.css
Copy to CodeMine
Open the demo in new window can open the designer
One cell can have two contexts: vertical and horizontal. If a cell has both vertical and horizontal context it will be a cross cell, which can be used to generate a cross report.
- For vertical context, the cell will use the vertical spill direction cell on the left as the vertical context. You can also specify a cell as the vertical context, or set the vertical context as none.
- For horizontal context, the cell will use the horizontal spill direction cell on the top as the horizontal context. You can also specify a cell as the horizontal context, or set the horizontal context as none.
You can use the following code to set the vertical and horizontal context for the cell:
// set vertical context as a custom cell
templateSheet.setTemplateCell(1, 1, {
type: 'Group',
binding: `Orders[customerId]`,
context: {
vertical: 'A1',
},
});
// set vertical context as none
templateSheet.setTemplateCell(1, 1, {
type: 'Group',
binding: `Orders[customerId]`,
context: {
vertical: 'None',
},
});
// set horizontal context as a custom cell
templateSheet.setTemplateCell(1, 1, {
type: 'Group',
binding: `Orders[customerId]`,
spillDirection: 'Horizontal',
context: {
horizontal: 'A1',
},
});
// set horizontal context as a custom cell
templateSheet.setTemplateCell(1, 1, {
type: 'Group',
binding: `Orders[customerId]`,
spillDirection: 'Horizontal',
context: {
horizontal: 'None',
},
});
// set both vertical and horizontal context for a cell.
templateSheet.setTemplateCell(1, 1, {
type: 'Summary',
aggregate: 'Sum',
binding: `Sales[Sales]`,
context: {
vertical: 'A2',
horizontal: 'B1',
},
});
Feedback
Submit and view feedback for