How to customize diagram nodes?

[JP]

Hi,

we try creating diagram nodes that consist of multiple paths, similar to the predefined BPMN Task shapes.

Nodes can be customized with the shape parameter. However, type 'Path' cannot take multiple paths with different styles, and HTML and Native elements with SVG content cannot be exported.

Is it possible to customize the ui of diagram nodes with the DiagramElement class and its derived classes like PathElement?

We tried setting the wrapper parameter of NodeModel to a Canvas with DiagramElements as children. But the diagram only renders a basic rectangle.

Could you provide an example of how to customize a node ui?

Thanks!

[Aravind Ravi]

Hi Jan, 

We do not have support to render multiple path in a HTML node. However, by using the group feature in diagram you can able to combine two or more nodes into single node. Group is used to cluster multiple nodes and connectors into a single element. It acts like a container for its children (nodes, groups, and connectors). Every change made to the group also affects the children. So you can render two or more path node and set different style for each node. After create the nodes add the nodes as a children to the group node. So that all nodes acts as a single group node. For more information about group node , please refer below UG documentation link 

Group node: https://ej2.syncfusion.com/react/documentation/diagram/group/ 

Regards 

Aravind Ravi