SelectionBasket Class

This class offers the ability to organize and manage selections in HOOPS Communicator via a “selection basket” approach. This makes it easy to stash and retrieve multiple lists of selected entities. A single selection basket manages multiple groups of selected entities and ensures that no entity appears in more than one group. It is also possible to create multiple selection baskets, each containing their own independent list of selection groups.


mySelectionBasket = new SelectionBasket(hwv);
Creates a new SelectionBasket object. The constructor should be called after the model is initialized (e.g. after the modelstructureready callback has fired).

mySelectionBasket.initializeUI("selectionbasketcontainer", true);
Initializes the UI for the selection basket. The first parameter is the id of the div that the selection basket will be using (in the above screenshot GoldenLayout is used to place the SelectionBasket UI to the right of the viewer).
The second parameter indicates if the default buttons should be shown. If this parameter is set to false you need to provide your own UI for the class on top of the selection table.

Generates a JSON object of all selection baskets meant for serialization.

Populates the selection baskets from the provided JSON object.

Restricts selections to a particular node in the hierarchy.

mySelectionBasket unsetRestrictToNode()
Unsets the selection restriction.

If set, selection will automatically pick the parent of a body node.

If you provide your own UI the following functions will also be relevant:

let newbasketid = mySelectionBasket.addBasket()
Adds a new selection basket and switches to it.

Switches to a different selection basket based on its id.

let activeBasketId = mySelectionBasket.deleteCurrentBasket()
Deletes the currently active selection basket.

Selects all elements in the active selection basket in the viewer.

Adds all nodes currently selected in the viewer to the currently active selection basket.

Adds a list of nodeids to the currently active selection basket.

Removes all nodes currently selected in the viewer from the currently active selection basket.

Removes a list of nodeids from the currently active selection basket.

Below is the code for the SelectionBasket class. Besides the standard HOOPS Communicator libraries and jQuery it uses tabulator to display the selection table. To include tabulator from a CDN add the following to your html:

<script type="text/javascript" src=""></script>

<link href="" rel="stylesheet">

It is important to note that this code is not production-ready and provided “as-is”. It is really meant as a starting point for your own development and as an example for some of the functionality and concepts used in HOOPS Communicator.

If you have any questions or comments, please don’t hesitate to post them here in the forum.

SelectionBasket.js (16.2 KB)