Why connectors in primefaces flowchart componant not appeared?

I am trying to use flowchart component in primefaces to view process flow but the connectors not appeared with me i used same code in the demo in this link

[primefaces demo]

https://www.primefaces.org/showcase/ui/data/diagram/flowchart.xhtml

i just copy and paste same demo code but the result is like that

[result with no connectors]

https://i.sstatic.net/WwIgo.png

my question what is missing to get the same result in the demo??

Solution

You've already found out that the showcase has a small pitfall builtin as it does'nt show the complete xhtml-page. A minimal empty page with the common namespaces is something like

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
    </h:head>
    <h:body>


    </h:body>
</html>

h:head is important as Primefaces automagically injects the dependencies (stylesheets, scripts) here.