Gojs palette with bootstrap accordion


I was using gojs palette ( go.GraphObject.make(go.Palette… ) to list all items available for drag-and-drop on canvas.

It worked as intended, but I need to tidy the list up a bit, so Ive added bootstrap4 accordion with intention to split my gojs palette into several palettes - where each one will be filling one accordion container.

Now im getting small grey squares instead of intended objects. When I change scale to very slow number, eg .0000002 Im getting part of textBlock which Im able to drag and drop on canvas. GoJS creates canvas inside of bootstrap accordion container with very small width, hovever, adjusting it does not help ( I see only textblock )

Anybody can suggest, what am I missing here?

html: https://pastebin.com/raw/v3y0PFMs
css: https://pastebin.com/raw/qdiuZLUU
js: https://pastebin.com/raw/6Cr5jWPm

I don’t know Bootstrap at all, but here’s an example of having Palettes in an Accordion: Planogram

Could you please update your profile with the actual company name for which you are either an employee or a contractor?


Is this possible to do without JQuery Library ?

Well, of course the answer to any question like “can I do this without jQuery?” is “yes”.

But that sample uses the jQuery UI Accordion, so of course it depends on jQuery. I know there are other accordion-like components out there that do not depend on jQuery.

Kindly suggest the accordion not using JQuery ?

With code please

I’m sorry, but I’m not familiar with any of them.