ajax - jsf 2：如何让 Primefaces 折线图每 1 秒改变一次？

Question

基本上，我想使用 Primefaces 折线图实现一个网页，该折线图可以每秒更改一次。

在我的托管 bean 中，我从我的数据库中获得了 100 个数据。我不想一次全部填充折线图，而是想像数据波一样显示它们，这样这 100 条数据可以在 100 秒内显示出来。

我该如何实施？

Answer 1

您应该从数据库中获取 100 个数据并将它们存储在一个列表中，比如说主列表，并且应该还有一个列表，每隔一秒刷新一次，并且主列表的当前元素将附加到第二个列表中。某事。像那样：

@ManagedBean
@ViewScoped
public class DataBean {

    private ArrayList<Data> mainList;//fill this from DB via seperate DAO class
    private ArrayList<Data> viewList;
    public int counter;
    //getter and setters
    public void refreshList() {
        viewList.add(mainList.get(counter);
        counter++;
    } 
}

在视图层，您应该refreshList定期调用方法，当然这可以使用p:pollor来完成p:remoteCommand。RemoteCommand 需要通过 JS 代码多次调用，就像：

jQuery(document).ready(function () {
    setInterval("updateChart", 1000);//every 1 sec
});

而这个功能。将调用p:remoteCommand名为updateChart：

<p:remoteCommand name="updateChart" actionListener="#{dataBean.refreshList}"
                             update="myChart"/>

myChart是您的p:lineChart组件的客户端 ID，您必须提供准确的 ID，您可以通过浏览器的开发人员设置检测它。

请记住，这不是可能存在错误的确切实现，并且p:lineChart需要模型类而不是 arrayLists，我从未使用过图表组件，但我假设系列类似于列表。希望这可以指导你。