CODEWITHSUNDEEP
jointjs
kittu
kittu

Reputation: 7018

How to get the links to the front when reparenting

All the cells/elements are embedded on top of other cell but the links are hidden behind the element. How do I get the links on top of the element(parent)

Here's the Preview

I tried with link.toFront() which isn't working. Below is my code snippet:

paper.on('cell:pointerdown', function (cellView, evt, x, y) {

                    var cell = cellView.model;
                    if (!cell.get('embeds') || cell.get('embeds').length === 0) {
                        // Show the dragged element above all the other cells (except when the
                        // element is a parent).
                        cell.toFront();
                        link.toFront();

                    }

                    if (cell.get('parent')) {
                        graph.getCell(cell.get('parent')).unembed(cell);
                    }
                });

Upvotes: 1

Views: 2136

Answers (1)

Roman
Roman

Reputation: 1674

If you want to bring a cell to the front with all connected links, try the following.

cell.toFront();
_.invoke(graph.getConnectedLinks(cell), 'toFront');

If you want to bring a parent cell with all its embedded cells to the front, call the toFront method with deep: true option. Method makes sure that all the descendants of the cell (embedded links and elements) are also brought to the front and no cell is hidden behind its parent (child z index is always higher than z index of child parent).

parent.toFront({ deep: true });

You can also checkout the embeddingMode and validateEmbedding paper options, that do the (un)embedding / validation automatically for you.

Documentation:

http://jointjs.com/api#joint.dia.Element:toFront

http://jointjs.com/api#joint.dia.Paper

Upvotes: 3

Related Questions