This guide describes how to set custom row height and column width in Flexmonster. You can resize:
You can set custom row height and column width in the following ways:
Resize rows and columns via UI by dragging header boundaries:
If you want to preset a row height and a column width in your report, we recommend the following approach:
Your report will now contain the custom table size configurations in the tableSizes property. If needed, you can edit the configurations programmatically. To learn more, see the TableSizeObject.
You can set custom row height and column width at runtime using the setTableSizes() API call:
pivot.setTableSizes({
columns: [
{
idx: 0,
width: 160
},
// Other columns
],
rows: [
{
tuple: ["category.[cars]"],
height: 80
},
// Other rows
]
});To see the current row height and column width, use getTableSizes().
Note If you need to set custom table sizes along with other report parts, use the setReport() API call Live example.
You can resize all rows, columns, or headers using the following CSS classes:
.fm-grid-row and .fm-grid-row-mobile to set the height of rows..fm-grid-column and .fm-grid-column-mobile to set the width of columns..fm-grid-header and .fm-grid-header-mobile to set the width and height of headers.Can't find your answer here?
Visit the FAQ page
Flexmonster Pivot Table & Charts is a JavaScript pivot table component for adding interactive reporting and data analysis to web applications. Users can summarize, filter, sort, and explore data in pivot tables and charts, drill into results, and export reports.