如何将更新推送到Primefaces图表?

时间:2014-03-03 15:58:05

标签: java primefaces charts atmosphere

Primefaces附带图表组件。我尝试使用Atmosphere / push框架通过推送操作更新图表。

xhtml:

<h:body>
    <p:panel id="panel">
        <p:lineChart id="category" value="#{beanViz.categoryModel}" legendPosition="e"
                     title="Category Chart" minY="0" maxY="200" style="height:300px;margin-top:20px"/>

</p:panel>
<h:form>
    <p:commandButton value="Update" actionListener="#{beanViz.update()}"></p:commandButton>
</h:form>
<p:socket onMessage="handleMessage" channel="/counter" />

beanViz中用于创建折线图的代码:

int increment = 0;
private CartesianChartModel categoryModel;
public CartesianChartModel getCategoryModel() {
    return categoryModel;
}

private void createCategoryModel() {
    categoryModel = new CartesianChartModel();
    ChartSeries boys = new ChartSeries();
    boys.setLabel("Boys");
    boys.set("2004", 120 + increment);
    boys.set("2005", 100);
    boys.set("2006", 44);
    boys.set("2007", 150);
    boys.set("2008", 25);
    categoryModel.addSeries(boys);
}

现在,与图表在同一页面上的commandButton会以一秒的间隔触发图表中一个值的更新:

public void update() {
    for (int i = 0; i < 50; i = i+5) {
        increment = increment + i;
        createCategoryModel();
        PushContext pushContext = PushContextFactory.getDefault().getPushContext();
        pushContext.push("/counter", "");
        try {
            Thread.sleep(1000);
        } catch (InterruptedException ex) {
            Logger.getLogger(BeanViz.class.getName()).log(Level.SEVERE, null, ex);
        }
    }
}

问题:它没有按原样更新图表的值,我不确定这是否是正确的继续进行方式。有什么帮助吗?

1 个答案:

答案 0 :(得分:1)

最近在primefaces展示中实现 http://www.primefaces.org/showcase-labs/push/chart.jsf