Display/Hide task based on different criteria

Developers
1

I would like to display the following diagram in different ways.

  1. I need to display only 1,3,5,7 for a criteria
  2. For another criteria i need to display 1,4,6
    Users can only view the diagram and click on task to open context pad. Whereas they can’t edit the diagram and details within the diagram.

Kindly advice. Thanks in advance.

2

If you just want to initially hide elements, you could clear the graphical representation of it:

var elementIds = [ "1", "4", "6" ];

// get all elements with the above ids
var elementsToHide = elementRegistry.filter(function(element) {
  return elementIds.indexOf(element.id) >= 0;
});

// get the graphical representation of these elements and hide clear it
forEach(elementsToHide, function(element) {
  var gfx = elementRegistry.getGraphics(element);
  gfx.clear();
});

Please note that the element is invisible but still exists, and nothing is changed in the XML.

Does this fit your use case?

1 Like
3

Hi,

I know that this topic is old, but it might be helpful for others. In my case I had to change slightly code in forEach loop to:

forEach(elementsToHide, function(element) {
  const gfx = elementRegistry.getGraphics(element); // gfx object is of type NamedNodeMap
  const styleHide = document.createAttribute('style'); // create Attr object with name style
  styleHide.value = 'display: none;'; // set value to attribute
  gfx.attributes.setNamedItem(styleHide); // apply attribute object 
});

But above solution works fine! Thanks @pedesen for sharing it!

Rafal

1 Like