Question

我真的遇到了麻烦！

我需要一些绝妙的想法来获得一个jsf页面，其中7个图表每隔20秒一个接一个地滑动，我需要这些图表是每30秒刷新一次。

我尝试了一些效果不佳的解决方案：

1.Slideshow + Poll

<h:form>
    <div align="center">
        <p:panel id="chartcontainer" style="border: none;">
            <p:imageSwitch style="width: 100%" 
                               id="slider" 
                               widgetVar="chartSlideShow" 
                               effect="turnDown" 
                               slideshowSpeed="5000">
                <ui:include src="/charts/chart1.xhtml"/>
                <ui:include src="/charts/chart2.xhtml"/>
                <ui:include src="/charts/chart3.xhtml"/>
                <ui:include src="/charts/chart4.xhtml"/>
                <ui:include src="/charts/chart5.xhtml"/>
                <ui:include src="/charts/chart6.xhtml"/>
                <ui:include src="/charts/chart7.xhtml"/>
            </p:imageSwitch>
        </p:panel>
        <p:poll widgetVar="pollWidget" 
                           update="@form"
                           interval="30"
                           oncomplete="PF('btnPlayWidget').disable();"/>
    </div>   
</h:form>

这个解决方案的问题是幻灯片和民意调查没有同步，所以当我观看图表3时，执行民意调查我不会期待更改和幻灯片重启从第一张图表。这真烦人！

2.Poll本身

<h:form>
    <div align='center'>
        <p:panel id="chartcontainer" style="border: none;">
            <ui:include src="#{slideView.slide}"/>  
        </p:panel>
        <p:poll widgetVar="pollWidget"
            update="@form"
            interval="20" 
            listener="#{slideView.next()}"
            oncomplete="PF('btnPlayWidget').disable();"/>
    </div>
</h:form>

这是我的slideView的bean：

package com.tvop.beans;

import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

@ManagedBean
@ViewScoped
public class SlideView implements Serializable {
    private int index = 0;
    String slide = "/charts/chart1.xhtml";

    private final String[] slides = new String[] {
        "/charts/chart1.xhtml",
        "/charts/chart2.xhtml",
        "/charts/chart3.xhtml",
        "/charts/chart4.xhtml",
        "/charts/chart5.xhtml",
        "/charts/chart6.xhtml",
        "/charts/chart7.xhtml"
    };

    public String getSlide() {
        return slide;
    }

    public void setSlide(String slide) {
        this.slide = slide;
    }

    public String next() {
        index %= slides.length;
        this.slide = slides[index];
        index++;
        return slide;
    }
}

此解决方案或多或少地运行但是轮询的间隔不准确，特别是在开始时，只要加载页面。第一个和第二个图表之间的第一次更改发生在30/35秒之后，而不是20，这是在民意调查的间隔中设置的。

我真的需要一些好主意，我不想被解雇。

谢谢你们所有的朋友们！

Answer 1

解决！

解决方案是自己使用poll组件;每隔20秒更新一次轮询，它会模拟imageSwitch行为！修改java bean也很重要，以使其工作。

遵循解决方案：

xhtml民意调查：

<div align='center'>
  <p:panel id="chartcontainer" style="border: none;">
    <p:panel style="border: 0px">
      <ui:include src="#{slideView.slide}" />
    </p:panel>
  </p:panel>
  <p:poll widgetVar="pollWidget"
          update="chartcontainer"
          interval="20" 
          listener="#{slideView.next()}"
          oncomplete="PF('btnPlayWidget').disable();"/>
</div>

slideview bean：

package com.tvop.beans;

import com.tvop.exceptions.DMLException;
import com.tvop.persistence.TkResourceJPA;
import com.tvop.persistence.dbentities.TkResource;
import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;
import java.util.Map;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import javax.faces.context.ExternalContext;
import javax.faces.context.FacesContext;

@ManagedBean
@ViewScoped
public class SlideView implements Serializable {
private SessionManager sessionManager = null;
private List<TkResource> resources;

private int index;
private String slide;
private final List<String> slides = new ArrayList<>();

public SlideView() {
    // Ottengo i privilegi sui chart tramite il bean sessionManager
    FacesContext ctx = FacesContext.getCurrentInstance();
    ExternalContext extCtx = ctx.getExternalContext();
    Map<String, Object> sessionMap = extCtx.getSessionMap();
    sessionManager = (SessionManager) sessionMap.get("sessionManager");

    try {
        resources = TkResourceJPA.getCharts();
    } catch (DMLException ex) {
        ex.printStackTrace();
    }

    SessionPrivileges privileges = sessionManager.getSessionPrivileges();

    for(TkResource resource : resources) {
        // Se è definito un privilegio controllo che privilegio è
        if (privileges.contains(resource.getResourceid())) {
            boolean currentResRendered = privileges.getRendered(resource.getResourceid());

            if(currentResRendered){
                slides.add(resource.getUrl());
            }
        }
    }

    index = 0;
    slide = slides.get(index);
}

public String getSlide() {
    return slide;
}

public void setSlide(String slide) {
    this.slide = slide;
}

public String next() {
    index %= slides.size();
    if (index == slides.size() - 1) {
        index = -1;
    }
    index++;
    this.slide = slides.get(index);

    return slide;
}

public String previous() {
    if (index == 0) {
        index = slides.size();
    }
    --index;
    this.slide = slides.get(index);
    return slide;
}
}

享受：）

如何滑动和刷新Primefaces图表

1 个答案: