https://community.fabric.microsoft.com/t5/Custom-Visuals-Development/Power-BI-Custom-visual-Table/m-p/4022758#M10095 <P>I am trying to create custom Table visual. While adding the conditional formating option I am getting error. How do I rectify it. Is there sample code available for custom Table visual. I checked the documentation but not getting much info.</P><P>&nbsp;</P><P>TS2322: Type '{ slices: undefined[]; }' is not assignable to type 'FormattingGroup | FormattingGroupPlaceholder'.<BR />Type '{ slices: undefined[]; }' is missing the following properties from type 'FormattingGroup': uid, displayName</P><P>&nbsp;</P><P>&nbsp;</P><LI-CODE lang="markup">public getFormattingModel(): powerbi.visuals.FormattingModel { const formattingModel: powerbi.visuals.FormattingModel = { cards: [] }; const formattingCard: powerbi.visuals.FormattingCard = { displayName: "Cell Elements", uid: "cellElementsCard", description: "Customize the cell elements", groups: [ { slices: [] } ] }; const tableData = this.dataView.table.rows; const columns = this.dataView.table.columns; tableData.forEach((row, rowIndex) =&gt; { row.forEach((cell, cellIndex) =&gt; { const columnName = columns[cellIndex].displayName; const colorSetting = this.tableSettings.cellElements.backgroundColor; const backgroundColorSlice: powerbi.visuals.FormattingSlice = { displayName: `${columnName} Background Color`, uid: `backgroundColor_${rowIndex}_${cellIndex}`, control: { type: powerbi.visuals.FormattingComponent.ColorPicker, properties: { descriptor: { objectName: "cellElements", propertyName: "backgroundColor", selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals), // Corrected option altConstantValueSelector: null, instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule }, value: { value: colorSetting } } } }; const fontColorSlice: powerbi.visuals.FormattingSlice = { displayName: `${columnName} Font Color`, uid: `fontColor_${rowIndex}_${cellIndex}`, control: { type: powerbi.visuals.FormattingComponent.ColorPicker, properties: { descriptor: { objectName: "cellElements", propertyName: "fontColor", selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals), // Corrected option altConstantValueSelector: null, instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule }, value: { value: this.tableSettings.cellElements.fontColor } } } }; formattingCard.groups[0].slices.push(backgroundColorSlice, fontColorSlice); }); }); formattingModel.cards.push(formattingCard); return formattingModel; }</LI-CODE><P>&nbsp;</P><P>&nbsp;</P> Wed, 03 Jul 2024 11:17:16 GMT max14 2024-07-03T11:17:16Z https://community.fabric.microsoft.com/t5/Custom-Visuals-Development/Power-BI-Custom-visual-Table/m-p/4022758#M10095 <P>I am trying to create custom Table visual. While adding the conditional formating option I am getting error. How do I rectify it. Is there sample code available for custom Table visual. I checked the documentation but not getting much info.</P><P>&nbsp;</P><P>TS2322: Type '{ slices: undefined[]; }' is not assignable to type 'FormattingGroup | FormattingGroupPlaceholder'.<BR />Type '{ slices: undefined[]; }' is missing the following properties from type 'FormattingGroup': uid, displayName</P><P>&nbsp;</P><P>&nbsp;</P><LI-CODE lang="markup">public getFormattingModel(): powerbi.visuals.FormattingModel { const formattingModel: powerbi.visuals.FormattingModel = { cards: [] }; const formattingCard: powerbi.visuals.FormattingCard = { displayName: "Cell Elements", uid: "cellElementsCard", description: "Customize the cell elements", groups: [ { slices: [] } ] }; const tableData = this.dataView.table.rows; const columns = this.dataView.table.columns; tableData.forEach((row, rowIndex) =&gt; { row.forEach((cell, cellIndex) =&gt; { const columnName = columns[cellIndex].displayName; const colorSetting = this.tableSettings.cellElements.backgroundColor; const backgroundColorSlice: powerbi.visuals.FormattingSlice = { displayName: `${columnName} Background Color`, uid: `backgroundColor_${rowIndex}_${cellIndex}`, control: { type: powerbi.visuals.FormattingComponent.ColorPicker, properties: { descriptor: { objectName: "cellElements", propertyName: "backgroundColor", selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals), // Corrected option altConstantValueSelector: null, instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule }, value: { value: colorSetting } } } }; const fontColorSlice: powerbi.visuals.FormattingSlice = { displayName: `${columnName} Font Color`, uid: `fontColor_${rowIndex}_${cellIndex}`, control: { type: powerbi.visuals.FormattingComponent.ColorPicker, properties: { descriptor: { objectName: "cellElements", propertyName: "fontColor", selector: dataViewWildcard.createDataViewWildcardSelector(dataViewWildcard.DataViewWildcardMatchingOption.InstancesAndTotals), // Corrected option altConstantValueSelector: null, instanceKind: powerbi.VisualEnumerationInstanceKinds.ConstantOrRule }, value: { value: this.tableSettings.cellElements.fontColor } } } }; formattingCard.groups[0].slices.push(backgroundColorSlice, fontColorSlice); }); }); formattingModel.cards.push(formattingCard); return formattingModel; }</LI-CODE><P>&nbsp;</P><P>&nbsp;</P> Wed, 03 Jul 2024 11:17:16 GMT https://community.fabric.microsoft.com/t5/Custom-Visuals-Development/Power-BI-Custom-visual-Table/m-p/4022758#M10095 max14 2024-07-03T11:17:16Z