Скрытие элементов на диаграмме

Question

У меня есть диаграмма только для чтения, чтобы визуализировать некоторые данные. Мои конечные пользователи хотели бы «фильтровать» данные таким образом, чтобы одновременно отображалось только подмножество данных. Я понимаю, что я могу перерисовать всю диаграмму каждый раз, когда применяю фильтр, пропускающий элементы, которые не должны отображаться, но мне интересно, есть ли способ, который я могу просто «скрыть» некоторые существующие элементы динамически, а затем снова показать их.

Чтобы попытаться сделать кристально чистым, если бы это была веб-страница вместо диаграммы, я бы сделал аналогию с применением CSS display: none к элементам по своему выбору.

Answer 1

Вы можете сделать то же самое с элементами/ссылками диаграммы JointJS. Например:

myElement.attr('./display', 'none') 

скрывает весь элемент группы SVG, в котором визуализируется элемент. Обратите внимание, что '.' - это специальный селектор, который указывает на всю группу. Если вы хотите скрыть только определенный подэлемент SVG, вы можете сделать это аналогично, например. для joint.shapes.basic.Rect элемента, вы могли бы сделать:

myRect.attr('rect/display', 'none') 

Это скрывает только прямоугольник (в SVG <rect> элемент, на который ссылается имя тега rect в attrs объекта - что мы изменяем с помощью метода attr()