Flexmonster Software License Agreement (“Agreement”) has been significantly revised and is effective as of September 30, 2024.
The following modifications were made:
The modified version of Flexmonster Software License Agreement is available here.
Downloading, installing, and/or continuing to use Flexmonster Software after September 30, 2024, constitutes Licensee’s acceptance of the terms and conditions of the modified version of Flexmonster Software License Agreement. If Licensee does not agree to any of these terms and conditions, they must cease using Flexmonster Software and must not download, install, use, access, or continue to access Flexmonster Software. By continuing to use Flexmonster Software or renewing the license under License Model or Maintenance after the effective date of any modifications to Agreement, Licensee accepts and agrees to be bound by the terms and conditions of the modified Agreement.
Fast and powerful web pivot table library for developers to process large datasets.
new Flexmonster({ container: "#pivot-container", componentFolder: "https://cdn.flexmonster.com/", height: 550, toolbar: true, report: { dataSource: { type: "json", filename: "data/retail-data.json", mapping: { "Quantity": { type: "number", }, "Price": { type: "number", }, "Retail Category": { type: "string", }, "Sales": { type: "number", }, "Order Date": { type: "year/quarter/month/day", }, "Date": { type: "date", }, "Status": { type: "string", }, "Product Code": { type: "string", }, "Phone": { type: "string", }, "Country": { type: "string", folder: "Location", }, "City": { type: "string", folder: "Location", }, "CurrencyID": { type: "property", hierarchy: "Country", }, "Contact Last Name": { type: "string", }, "Contact First Name": { type: "string", }, "Deal Size": { type: "string", }, }, }, slice: { rows: [ { uniqueName: "Country", filter: { members: [ "country.[australia]", "country.[usa]", "country.[japan]", ], }, }, { uniqueName: "Status", }, ], columns: [ { uniqueName: "Order Date", }, { uniqueName: "[Measures]", }, ], measures: [ { uniqueName: "Price", aggregation: "sum", format: "currency", }, ], sorting: { column: { type: "desc", tuple: [], measure: { uniqueName: "Price", aggregation: "sum", }, }, }, expands: { rows: [ { tuple: ["country.[japan]"], }, ], }, drills: { columns: [ { tuple: ["order date.[2019]"], }, ], }, flatSort: [ { uniqueName: "Price", sort: "desc", }, ], }, conditions: [ { formula: "#value > 35000", measure: "Price", aggregation: "sum", format: { backgroundColor: "#00A45A", color: "#FFFFFF", fontFamily: "Arial", fontSize: "12px", }, }, { formula: "#value < 2000", measure: "Price", aggregation: "sum", format: { backgroundColor: "#df3800", color: "#FFFFFF", fontFamily: "Arial", fontSize: "12px", }, }, ], formats: [{ name: "", thousandsSeparator: ",", decimalSeparator: ".", decimalPlaces: 2, nullValue: "-" }, { name: "currency", currencySymbol: "$" } ] }, customizeCell: customizeCell, shareReportConnection: { url: "https://olap.flexmonster.com:9500", }, beforetoolbarcreated: function (toolbar) { toolbar.showShareReportTab = true; }, }); function customizeCell(cell, data) { if (data.type === "header" && data.hierarchy?.caption === "Country" && data.member?.properties) { const name = data.member.properties.CurrencyID; cell.addClass("fm-custom-cell"); let flag; if (data.expanded) { flag = `<i class="fm-icon fm-expanded-icon" title="Click to collapse"></i> <img class="flag-icon" src="https://cdn.flexmonster.com/flags/${name.toLowerCase()}.svg">`; } else { flag = `<i class="fm-icon fm-collapsed-icon" title="Click to expand"></i> <img class="flag-icon" src="https://cdn.flexmonster.com/flags/${name.toLowerCase()}.svg">`; } cell.text = `<div style="display:flex; align-items:center; font-size:12px; position:relative;"> ${flag}<span style="margin-left: 2px; line-height: 16px;">${data.member.caption}</span></div>`; } }
<div id="pivot-container"></div>
.fm-custom-cell { display: flex !important; align-items: center !important; font-size: 12px !important; } .fm-custom-cell .flag-icon { width: 21px !important; height: 16px !important; margin-left: 0 !important; margin-right: 2px !important; } #fm-pivot-view .fm-grid-layout .fm-custom-cell.fm-expanded .fm-expanded-icon::before, #fm-pivot-view .fm-grid-layout .fm-custom-cell.fm-collapsed .fm-collapsed-icon::before { top: -2px; height: 16px; }
Flexmonster Pivot Table is a ready-made reporting tool that can show the data to your end-users fast. It can help them create interactive responsive pivot grids and charts from various data sources and formats, such as CSV, JSON, Elasticsearch, Microsoft Analysis Services, MongoDB, SQL databases (MySQL, PostgreSQL, Oracle, etc) or other custom data sources.
Flexmonster pivot grid seamlessly integrates with all popular client-side frameworks (Angular, React, Vue, Blazor etc.), server-side technologies, and programming languages. Check out the full list of available pivot table integrations.
You can add our pivot grid component to any project and adjust it to your needs. Pivot table can be customized to perfectly match your application’s design, localization, and customization preferences.
You and your end-users can control how the data records are arranged on the grid using the pivot table layouts: classic (tabular), compact, or flat. It is also possible to show details about values cells in the drill-through view.
The results of data analysis and reporting can be printed or exported to the files of the most common formats: PDF, CSV, Excel, HTML, or PNG. As a developer, you can define how an end-user can export their reports: to the local file system or a server.