Your search did not match any results.
Pivot Grid

OLAP Data Source

Documentation
The PivotGrid supports OLAP services (MS SQL Server Analysis Services). This allows you to deliver solutions that can easily analyze millions of data rows within your app. In this demo, the PivotGrid uses an XmlaStore to connect the widget to a sample remote OLAP service.
Copy to Codepen
Apply
Reset
$(function(){ $("#sales").dxPivotGrid({ allowSortingBySummary: true, allowSorting: true, allowFiltering: true, allowExpandAll: true, height: 570, showBorders: true, "export": { enabled: true, fileName: "Adventure Works" }, dataSource: { fields: [ { dataField: "[Product].[Category]", area: "row" }, { dataField: "[Product].[Subcategory]", area: "row" }, { dataField: "[Ship Date].[Calendar Year]", area: "column" }, { dataField: "[Ship Date].[Month of Year]", area: "column" }, { dataField: "[Measures].[Customer Count]", area: "data" } ], store: { type: "xmla", url: "https://demos.devexpress.com/Services/OLAP/msmdpump.dll", catalog: "Adventure Works DW Standard Edition", cube: "Adventure Works" } } }); });
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>DevExtreme Demo</title> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <script src="js/jquery-3.1.0.min.js"></script> <link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/16.2.5/css/dx.spa.css" /> <link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/16.2.5/css/dx.common.css" /> <link rel="dx-theme" data-theme="generic.light" href="https://cdn3.devexpress.com/jslib/16.2.5/css/dx.light.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.2/jszip.min.js"></script> <script src="https://cdn3.devexpress.com/jslib/16.2.5/js/dx.all.js"></script> <link rel="stylesheet" type ="text/css" href ="styles.css" /> <script src="index.js"></script> </head> <body class="dx-viewport"> <div class="demo-container"> <div class="long-title"><h3>Sales Statistics</h3></div> <div id="sales"></div> </div> </body> </html>
.long-title h3 { font-family: 'Segoe UI Light', 'Helvetica Neue Light', 'Segoe UI', 'Helvetica Neue', 'Trebuchet MS', Verdana; font-weight: 200; font-size: 28px; text-align: center; margin-bottom: 20px; }