Hi,
I am trying to generate a flowchart in my app. I tried out the code from the demo site.. Line/connection between elements are not showing up, only elements are showing up.
using olympos 1.1.3 and PF 6.0.11.
Thanks for your help!
Flow Chart not working
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Sorry for my late reply. Please try the following css;
Exp page;
Code: Select all
<style type="text/css">
.ui-diagram-element {
width:14em;
height:4em;
line-height:4em;
text-align: center;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.8);
border-radius: 4px;
border: 1px solid transparent;
background-color: #98AFC7;
color: #ffffff;
}
.ui-diagram-success {
background-color: #9CB071;
color: #ffffff;
border-color: #7ab02c;
}
.ui-diagram-fail {
background-color: #C34A2C;
color: #ffffff;
}
.flow-label {
font-size: 24px;
font-weight: bold;
color: #816A51;
}
</style>
Code: Select all
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
template="/WEB-INF/template.xhtml">
<ui:define name="content">
<div class="Container100">
<div class="Card TexAlCenter">
<p:diagram value="#{diagramFlowChartView.model}" style="height:600px" styleClass="ui-widget-content" />
</div>
</div>
</ui:define>
</ui:composition>
Github Profile: https://github.com/mertsincan
-
- Posts: 10
- Joined: 06 Jun 2016, 09:44
Thanks, But it is still not working.
I am getting below error in my console:
I am getting below error in my console:
Code: Select all
core.js.xhtml?ln=primefaces&v=6.0.12:1 Widget not available: Olympos
core.js.xhtml?ln=primefaces&v=6.0.12:1 Widget not available: Olympos
diagram.js.xhtml?ln=primefaces&v=6.0.12:1 TypeError: Cannot read property 'parentNode' of null
at r.endpointAdded (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at aD (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at I.jsPlumbInstance.addEndpoint (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at c.initEndPoints (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at diagram.js.xhtml?ln=primefaces&v=6.0.12:1
at I.jsPlumbInstance.batch (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at I.jsPlumbInstance.<anonymous> (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at I.jsPlumbInstance.fire (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at I.jsPlumbInstance.<anonymous> (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
at c (diagram.js.xhtml?ln=primefaces&v=6.0.12:1)
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Sorry for my late reply, does it work without olympos?
Github Profile: https://github.com/mertsincan
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Could you please attach layout.js file in your Olympos version? I think you need to update your layout.js.
Github Profile: https://github.com/mertsincan
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
it works fine for me with my above css;
Test codes; https://www.primefaces.org/showcase/ui/ ... hart.xhtml
Test codes; https://www.primefaces.org/showcase/ui/ ... hart.xhtml
Github Profile: https://github.com/mertsincan
-
- Information
-
Who is online
Users browsing this forum: No registered users and 0 guests