Clear selection using toolbar on extension

[maxim1500]

Hello,

I created a custom chart extension which supports multiple selection. Based on the documentation, the method selectValues() displays the selection toolbar. Indeed, it is displayed and the correct styling is applied to my selected / unselected elements (unselected elements are opacity 30%). My extension sets the selection by adding the .selected css class to the selected element. But if I click on the "Clear Selection" button in the toolbar, the selection is cleared in the app, but not in my extension. The .selected classes stays, even after the selection is confirmed.

Based on this thread (How to catch "clear selections" event ?), I expected the selected class to be removed. I also tried to overwrite the clear event without success.

Any idea on how to fix this?

[ErikWetterberg]

Hi,

Have you tried clearing the 'selected' css class in your paint method? That might help.

Erik

[maxim1500]

Thanks Eric for your help! I tried your suggestion, but Paint is not called when the user clicks on Clear Selection. It might help otherwise though (when closing the selection...).

[larry_w_ · Accepted solution]

I had this same issue.  The "cancel selections" button was not clearing the "selected" class when using the standard selection model.
I set a watch on the selection count and used D3.js to clear the class (you could also use jQuery).  This seems to work.

scope.$watch(

    function() {

        return scope.layout.qHyperCube.qDimensionInfo[0].qStateCounts.qSelected;

    }

    ,function(newValue, oldValue) {

        if (newValue != oldValue && newValue == 0) {

            d3.selectAll(".selected").classed("selected",false);

        }

    }

);

[maxim1500]

Thanks for the tip! I'll try that!