How to hide/show the overlays in subprocess(collapsed/expanded) with viewer

Developers
1

expanded notexpanded

2

Hi @Kay-M
It’s very hard to understand what you want to achieve. Can you give us more details or a minimal test case to explain what you want to do?

3

1.there are some UserTask in SubProcess;
2.I add overlays to show how many instance are waiting at the UserTask;
3.I override a CustContextPad to expand/collapsed the subprocess in bpmn-js/lib/Viewer
4.when Viewer.importXML done I add the overlays to the canvas;
and now i don’t know how to hide or show the overlay html when the subprocess expand or collapse.

Do I have a clear description? thanks

4

When a SubProcess collapses or expands, its children elements are automatically hidden or displayed，if there are some overlays added to its children, the overlays will automatically hidden or displayed??? thank u.

5

Thanks for providing me more details! I guess the hiding of the children’s overlays when collapsing a subprocess is just missing for the moment. I’ve just opened an issue for it. Maybe you can read over it and tell me whether I got in the way you mean it?

6

yeah, this is just what i mean, Now, my solution to the problem is as follows
Modeling.toggleCollapse() ->
ToggleShapeCollapseHandler.execute() ->
CommandStack._popAction() ->
fire(‘elements.changed’)

The main code is as follows

viewer.on('elements.changed', (event) => {
    let overlays = this._viewer.get('overlays');
    event.elements.forEach(element => {
        if (element.hidden != undefined) {
            let transactionBoundaries = overlays.get({
                element: element,
                type: 'transaction-boundaries'
            });
            transactionBoundaries.map(o => {
                o.htmlContainer.style.display = element.hidden === true ? 'none' : '';
            });
        }
    });
});

viewer.importXML(xml, (err) => {
    viewer.get('transactionBoundaries').show();
});

thanks for your help!!!:grinning:

3 Likes
7

Thanks for sharing your concise workaround.

1 Like
8

and need to determine the value of element.hidden in the Overlays.add () method to set the value of overlay.htmlContailer.style.display.
can handle this problem by listening for ‘canvas.viewbox.changed’ events, similar to handling ‘elements.changed’ events