<a:diagram value="#{diagramBasicView.model}" style="height:400px" styleClass="ui-widget-content" /> /* Demo CSS */ <style type="text/css"> .ui-diagram-element { border:0.1em dotted #d4e06b; width:14em; height:4em; line-height:4em; text-align: center; } </style>
package com.jarch.showcase.view.data.diagram; import javax.annotation.PostConstruct; import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; import org.primefaces.model.diagram.DefaultDiagramModel; import org.primefaces.model.diagram.DiagramModel; import org.primefaces.model.diagram.Element; import org.primefaces.model.diagram.Connection; import org.primefaces.model.diagram.endpoint.DotEndPoint; import org.primefaces.model.diagram.endpoint.EndPointAnchor; @ManagedBean(name = "diagramBasicView") @RequestScoped public class BasicView { private DefaultDiagramModel model; @PostConstruct public void init() { model = new DefaultDiagramModel(); model.setMaxConnections(-1); Element elementA = new Element("A", "20em", "6em"); elementA.addEndPoint(new DotEndPoint(EndPointAnchor.BOTTOM)); Element elementB = new Element("B", "10em", "18em"); elementB.addEndPoint(new DotEndPoint(EndPointAnchor.TOP)); Element elementC = new Element("C", "40em", "18em"); elementC.addEndPoint(new DotEndPoint(EndPointAnchor.TOP)); model.addElement(elementA); model.addElement(elementB); model.addElement(elementC); model.connect(new Connection(elementA.getEndPoints().get(0), elementB.getEndPoints().get(0))); model.connect(new Connection(elementA.getEndPoints().get(0), elementC.getEndPoints().get(0))); } public DiagramModel getModel() { return model; } }