Hi,
I'm using Pivotview control (angular) to display data from OLAP. I follow the demo on syncfusion webbsite.
html
<div class="col-md-9 listmaincontent">
<H2>{{selectedCube?.name}}</H2>
<div class="control-section" id="pivot-table-section">
<div>
<ejs-pivotview #pivotview id='PivotView' [dataSourceSettings]=dataSourceSettings allowExcelExport='true'
allowConditionalFormatting='true' allowPdfExport='true' showToolbar='true' allowCalculatedField='true'
renderMode='Fixed' showFieldList='true' showGroupingBar='true' width='100%' [chartSettings]='chartSettings'
[displayOption]='displayOption' height='800' [gridSettings]='gridSettings' [toolbar]='toolbarOptions'
(saveReport)='saveReport($event)' (loadReport)='loadReport($event)' (fetchReport)='fetchReport($event)'
(renameReport)='renameReport($event)' (removeReport)='removeReport($event)' (newReport)='newReport()'
(toolbarRender)='beforeToolbarRender($event)'>
</ejs-pivotview>
</div>
</div>
ts file
ngOnInit(): void {
this.displayOption = { view: 'Both' } as DisplayOption;
this.gridSettings = {
columnWidth: 160
} as GridSettings;
this.toolbarOptions = ['New', 'Save', 'SaveAs', 'Rename', 'Remove', 'Load',
'Grid', 'Chart', 'MDX', 'Export', 'SubTotal', 'GrandTotal', 'ConditionalFormatting', 'FieldList'] as ToolbarItems[];
this.subCubes = this.dataService.getCubes()
.subscribe({
next: (cubes: SsasCube[]) => {
this.Cubes = cubes;
if (this.Cubes.length>0)
{
this.selectedCube = this.Cubes[0];
this.dataService.changeSelectedCube(this.selectedCube);
this.dataSourceSettings = {
catalog: this.selectedCube.catalog,
cube: this.selectedCube.name,
providerType: 'SSAS',
url: this.selectedCube.url,
localeIdentifier: this.selectedCube.locale,
enableSorting: true
};
}
},
error: err => console.log(err)
});
}
style.css
@import '../node_modules/@syncfusion/ej2-base/styles/material.css';
@import '../node_modules/@syncfusion/ej2-buttons/styles/material.css';
@import '../node_modules/@syncfusion/ej2-dropdowns/styles/material.css';
@import '../node_modules/@syncfusion/ej2-grids/styles/material.css';
@import '../node_modules/@syncfusion/ej2-inputs/styles/material.css';
@import '../node_modules/@syncfusion/ej2-lists/styles/material.css';
@import '../node_modules/@syncfusion/ej2-navigations/styles/material.css';
@import '../node_modules/@syncfusion/ej2-popups/styles/material.css';
@import "../node_modules/@syncfusion/ej2-splitbuttons/styles/material.css";
@import '../node_modules/@syncfusion/ej2-angular-pivotview/styles/material.css';
After select the Measure: "Internet Sales" and dimension: "Product", the pivot view not showing data though it has data on the grid (I know it has by using development tool). It seems to me some Css by default not display data. After using Developer tool and alter some style, it started showing as in the 2 attached image files.
Could you please help me out?
Thanks,
Nam
Attachment:
Documents_8cdb421f.zip
