Flexmonster MCP Server is here! Connect your ✨AI assistant to our documentation. Get started
+
Get Free Trial
Get Free Trial
  1. Pivot Table demo
Data Sources
  1. MS Analysis Services
  2. Elasticsearch
  3. JSON and CSV
Views
  1. One million rows
  2. Pivot charts
  3. Dashboard
  4. Classic (tabular) view
  5. Flat table
Integration
  1. With amCharts
  2. With Highcharts
  3. With FusionCharts
  4. With Google Charts
Other
  1. Themes
  2. Localization
  3. Heat map
  4. Custom cells
  5. Live data update
  1. More examples

JavaScript Pivot Table: Flat view

A flat table is a simple form of Flexmonster Pivot for displaying initial data in an Excel-like data grid view.

For the best experience

Play with the demo on a larger screen: save this link for later or watch the video review now.


Edit in JSfiddle Get Free Trial
    new Flexmonster({
  container: "#pivot-container",
  componentFolder: "https://cdn.flexmonster.com/",
  report: {
    dataSource: {
      type: "csv",
      filename: "data/data.csv"
    },
    options: {
      grid: {
        type: "flat"
      }
    },
    slice: {
      measures: [
        {
          uniqueName: "Country"
        },
        {
          uniqueName: "Category"
        },
        {
          uniqueName: "Color"
        },
        {
          uniqueName: "Price"
        },
        {
          uniqueName: "Discount"
        }
      ]
    },
    formats: [
      {
        name: "",
        thousandsSeparator: ",",
        decimalSeparator: ".",
        decimalPlaces: 2,
        currencySymbol: "$"
      }
    ]
  }
});

    <div id="pivot-container"></div>

    This minimalistic non-hierarchical grid view allows end-users to show their data row-by-row, as the records come from the data source. Cells of the flat table contain raw, non-aggregated values.

    The features of the flat grid are the same as for the classic (tabular) and compact layouts. Via the Field List, an end-user can choose which columns to show, order them, filter, and sort. Plus, it's possible to enable grand totals and show them at the top or bottom row of the table.

    What makes this form distinct from others is multi-column sorting: use Ctrl + click (Command + click on macOS) to sort the records by multiple fields.

    To quickly change the view angle of your report, you can switch to the classic (tabular) or compact forms.

    See our live examples

    Classic view With amCharts
    Prev Next

    Frequently asked questions

    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.