Planogram with repeatable background icon

Using GoJS (v1.7.29), how do I code the following:

Step One: Drag and drop an item (depicted by an icon - e.g. wrench icon) from the Planogram palette to the rack.
Step Two: Resize the wrench icon’s bounding box to fill multiple grid squares. As you resize the wrench icon, the icon image should duplicate itself based on a specific value for that item. For example, you can fit 2.3 wrenches per 1 grid square.

This would be faster than dragging and dropping each wrench individually.

Thank you for your assistance.

Would using a pattern Brush meet your requirements?

Thanks for your quick response and suggestion. I’m not sure if this would work. I would not want the “rack” to display half of an item (e.g. half of a wrench).

Perhaps I could do it this way:

  1. Select single item (e.g. icon with 1 wrench) from the palette.
  2. When the item is dropped onto the “rack” it changes to a different icon (e.g. icon with 3 wrenches).
  3. Resize the item/node and have the background (3 wrenches) just repeat itself for every grid square.

Any suggestions on how to accomplish this? Thanks so much.

To prevent showing fractions of the pattern image, you could set Part | GoJS API

That may work. I will give it a try. Thanks!

The pattern brush is working well. Thank you for your suggestion.

Can you point me in the right direction so that I can do the following: change the palette icon to a pattern brush when the item is dragged and dropped from the palette to the rack.

Why can’t you use the same template in both the Palette as well as your Diagram?

But if you want or need to use different templates, that’s OK too.

Got it working. Thank you!