How to change node properties from event?

Question

I'm trying to change the node properties (such as color or border width) from the click event.So far I've programmed a click handler:function handleDiagramClick(args) {
    if (args.actualObject.type !== 'bpmn') {
        // Some of my irrelevant logic is here...
        return;
    }
 
    // Here I'd like to set node properties
}I see that args contain property object and actualObject - which one should I update? How do I make the diagram refresh with my changes? Can I use hex colors? If not, what is permitted list of colors that are passed as string (for instance 'darkcyan', 'black')?

Shyam G · Answer

Hi Michal, 

Please use updateNode method in the click event to achieve your requirement. 

Code example: 
$("#diagram").ejDiagram({ 
  
                    click: click, 
                      
                }); 

function click(args) {             
            var diagram = $("#diagram").ejDiagram("instance"); 
            if (args.element) { 
                diagram.updateNode(args.element.name, {fillColor:"red"}); 
            } 
        } 

JSPlayground link:http://jsplayground.syncfusion.com/n4fwerkv 

Regards, 
Shyam G