Forum Discussion
Advocate IVCustom Visual - Selecting, Filtering and Highlighting
Partial solution to the selection problems (issues 1 and 2), but not the fact that other visuals are filtered not highlighted (3).
The problem stems from the fact that when more than one category column is add to createSelectionIdBuilder() it causes the cross-filtering to error when more than one data point is selected.
The fix is to only add one category column to the createSelectionIdBuilder - it doesn't matter which one, and the values in the column appear to be irrelevant. This is counter intuitive if comparing with an SQL select, or any other filtering function which would look to match against the values in the category columns. The resultant code (showing the removed line commented out) is as follows:
const selectionId: ISelectionId = this.host.createSelectionIdBuilder() .withCategory(ageRange, i) // .withCategory(gender, i) .createSelectionId();It would be helpful if PowerBI provided a more useful error message, or error checking, to advise that more than one category is not permitted when cross filtering; or even, have a solution which doesn't throw an error when more than one category is selected.
Advocate IVThank you v-viig
The data consists of two category columns and two measure columsn:
ageRange(Category) Gender(Category) Value(Measure) Reference(Measure) A0-4 Male 5,000 5,500 A0-4 Female 4,500 6,000 A5-9 Male 5,500 5,500 A5-9 Female 4,600 6,000 ... A85+ Female 1,500 900
Selection/Filtering is on both AgeRange and Gender.
SelectionId Code (summarised):
const dataView: DataView = data.dataViews[0];
const ageRange: DataViewCategoryColumn = dataView.categorical.categories[0];
const gender: DataViewCategoryColumn = dataView.categorical.categories[1];
const valueColumn: DataViewValueColumn = dataView.categorical.values[fieldIndices[interfaceFields.values]];
const refColumn: DataViewValueColumn = dataView.categorical.values[fieldIndices[interfaceFields.reference]];
for (let i: number = 0; i < dataView.categorical.categories[0].values.length; i++) {
const selectionId: ISelectionId = this.host.createSelectionIdBuilder()
.withCategory(ageRange, i)
.withCategory(gender, i)
.createSelectionId();
chartViewModel.dataPoints.push(new DataPoint({
age: <string>ageRange.values[i],
gender: <string>gender.values[i],
value: getValues(interfaceFields.values, i) || 0,
reference: getValues(interfaceFields.reference, i) || 0,
highlightValue: getHighlights(interfaceFields.values, i) || 0,
highlightReference: getHighlights(interfaceFields.reference, i) || 0,
identity: selectionId,
specificIdentity: selectionId,
highlighted: isHighlighted,
selected: false
}));
}
Link to code in-situ on gitHub
For reference the error message when two or more individual points are selected is included below:
Advocate IV
Partial solution to the selection problems (issues 1 and 2), but not the fact that other visuals are filtered not highlighted (3).
The problem stems from the fact that when more than one category column is add to createSelectionIdBuilder() it causes the cross-filtering to error when more than one data point is selected.
The fix is to only add one category column to the createSelectionIdBuilder - it doesn't matter which one, and the values in the column appear to be irrelevant. This is counter intuitive if comparing with an SQL select, or any other filtering function which would look to match against the values in the category columns. The resultant code (showing the removed line commented out) is as follows:
const selectionId: ISelectionId = this.host.createSelectionIdBuilder()
.withCategory(ageRange, i)
// .withCategory(gender, i)
.createSelectionId();It would be helpful if PowerBI provided a more useful error message, or error checking, to advise that more than one category is not permitted when cross filtering; or even, have a solution which doesn't throw an error when more than one category is selected.
- v-viig
Community Champion
Do you use categorical data mapping? Are you able to use table instead?
The table mapping provides a row specific selectors. Thatwill allow us to select multiple rows.
Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals
- diaAzul
Ignat,
The chart uses categorical data mapping. This is necessary as the chart is driven by two category columns (ageRange and gender). The ageRange categories determine the categories on the vertical y-axis, and the gender determines whether the data is displayed as a horizontal bar to the left or right of the central y-axis.
Within the chart options, there is a seperate box to enter the ageRange column and another for the gender. If this was to be implemented as a table it would not be easy to identify which column in the table represented the ageRange, the gender and the measures. So, no I do not believe that it would be possible to use a table.
I've looed through the way selections are passed between visuals on the page and the way that selectionId is generated. From my observation, even in a categorical chart, the selectionId is a row based ID. As long as only one category column is used in the create SelectionIDBuilder it doesn't matter which category it is, so long as only one category is used. It would appear that the column chosen is used to identify the table, and then the Id from that table is used to drive the selection process.
The only complication that I haven't tested is where the ageRange category comes from one table (Table A) which is joined with another table (Table B) which contains both ageRange, gender and measure data. If the selectionId is created from ageRange then it will only have selectoinId based on Table A, however, if it is based on gender it will havae selection Id based on Table B. This may affect how selections are then propagated throughout the page. Ihaven't had time to test this yet, but will do so over the next couple of weeks as it may have some implications for the design of the visual and how selections are implemented.
For now the selections work fine, but I can only filter other visuals, I cannot highlight them.
- v-viig
Selection works as a filter since you use applySelectionFilter method that applies a filter.
Please remove the call of this method to change behavior of selection to highlighting.Ignat Vilesov,
Software Engineer
Microsoft Power BI Custom Visuals
