Group Facet in Timeline

UI Components for JSF
Post Reply
JimmyDev
Posts: 2
Joined: 07 Sep 2017, 15:40

07 Sep 2017, 21:31

Hey guys, I am using the timeline in Primefaces 6.1. Mojarra 2.2.14. And Payara 173 Full. I know in earlier versions, when the timeline was an extension, you could add a facet named "group" that would allow you to modify the group facet on the timeline. It however does not appear to work in this version.

What I am trying to achieve is adding a category label above the group labels in the Y axis portion. Below is what I tried (not sure if group has an index on it, I didn't get that far since my facet was ignored). Are there any other tricks I could use to get the label in that area without using some really ugly css to absolutely position it?

Code: Select all

<p:timeline id="cm-patientregistry-facesheet-timeline"
                                        value="#{someBean.timeline}"
                                        editable="false"
                                        eventMargin="20"
                                        eventMarginAxis="0"
                                        showNavigation="false"
                                        showButtonNew="false"
                                        showMinorLabels="true"
                                        showCurrentTime="false"
                                        zoomMax="#{someBean.zoomMax}"
                                        zoomMin="#{someBean.zoomMin}"
                                        eventStyle="dot"
                                        min="#{someBean.min}"
                                        max="#{someBean.max}"
                                        axisOnTop="true"
                                        stackEvents="false"
                                        var="event"
                                        moveable="true"
                                        varGroup="group"
                                        styleClass="cm-timeline"
                                        widgetVar="timelineAlert">
                                <p:ajax event="rangechange" oncomplete="onRangeChange('timelineAlert')"/>

                                <f:facet name="">
                                    <h:outputText value="#{event.category} rendered="#{group.index eq 0}"/>
                                    <h:outputText value="Prepend #{group}" />
                                </f:facet>

                                <p:outputPanel id="timeline-event" styleClass="#{event.name.contains('range') ? '' : 'cm-event-icon fa fa-border'} #{event.iconClass}" />

                            </p:timeline>

JimmyDev
Posts: 2
Joined: 07 Sep 2017, 15:40

08 Sep 2017, 16:38

NVM, I resolved this myself.

It appears that in order for the group facet to take effect, you have to set the "groups" list on the Timelines model directly, and not rely on just using the groups from the event. Once I did that the facet started working.

Post Reply

Return to “PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 40 guests