I'm building a tool to help young students explore place value concepts using ZIM. I’d like students to be able to group multiple objects (e.g., 10 out of 12 rectangles in a container) using a selection tool—similar to a lasso or drag-to-select box. Once selected, these groups should be manipulable as a single unit (e.g., dragged, counted, or exchanged for another representation).
Does ZIM have any built-in tools or recommended approaches for:
Creating a selection rectangle to group objects
Visually indicating selected items
Programmatically treating a group of selected objects as one (e.g., combining into a Container)
Any suggestions or code patterns would be greatly appreciated!
I think this example will give you most of what you are looking for. It is a little old, but most of the core code would be the same. There is no out-of-the-box solution to selecting aside from SelectionSet and selectionManager so check the docs for those but we did not use them for the example. To hold a set of things we use a Container. To make all the objects in a container drag we use container.drag({all:true}); otherwise its children drag individually. We used drop shadow to indicate selected objects... but you could change colors instead.
Note... you can now use shape methods right on the Shape rather than the graphics property - so new Shape().f(red).dr(100,100,300,300).addTo(); The graphics property still works, though.
