I tried this snippet under Power BI API 2.1, it works fine for the first row, then it continues to work only for that row, so I can deselect it, select again, etc. And another control (e.g. Donut chart) displays selected value highlighted while I would expect all other values filtered out and only selected one displayed. Then if I select another row, Donut chart displays "Can't display the visual" error.
Even if I deselect that another row and select the 1st row back, I still get that error.
Under API 1.13 this snippet has no effect.
So what I want to know is how can I filter out unselected rows, not just highlight selected ones, so my slicer to work like HierarchySlicer or Sample Slicer.
Is the only way to achieve this is to use Interactivity Service?
Here is how I did this. First I added a check box for each of options.dataViews[0].categorical.categories[0].values both to control and this.checkboxes list so that i in snippet below represents row index and then when user checks or clears any checkbox, I clear selection and add each row index to it.
private onCheckBoxChange() {
this.selectionManager.clear();
for (let i = 0; i < this.checkBoxes.length; i++) {
const checkBox = this.checkBoxes[i];
if (checkBox.checked) {
for (let category of this.updateOptions.dataViews[0].categorical.categories) {
const selectionId = this.selectionIdBuidler
.withCategory(category, i)
.createSelectionId();
this.selectionManager.select(selectionId, true);
}
}
}
} selectionManager and selectionIdBuilder are created in constructor
constructor(options: VisualConstructorOptions) {
this.selectionManager = options.host.createSelectionManager();
this.selectionIdBuidler = options.host.createSelectionIdBuilder();
...
}and the checkboxes in update method
public update(options: VisualUpdateOptions) {
...
const values = options.dataViews[0].categorical.categories[0].values;
for (let i in values) {
const value = values[i];
const checkBox = document.createElement("input");
checkBox.type = "checkbox";
checkBox.addEventListener("change", () => this.onCheckBoxChange());
this.checkBoxes.push(checkBox);
...
}
...
}
