Jsf Primefaces图表缩放和主题行为

我想尝试一下jsf的primefaces库，看看它是否适合我在仪表板和图表创建方面的需要。我尝试在折线图中使用一些虚假数据设置仪表板，以评估其行为：

<div style="height:500px">
                <p:growl id="msgs" showDetail="true" />
                <p:dashboard id="board" model="#{dashboardManagedBean.model}">
                    <p:ajax event="reorder" listener="#{dashboardManagedBean.handleReorder}" update="msgs" />
                    <p:panel width="100%" id="Finance" header="Finance" closable="true" toggleable="true">
                        <p:chart type="line" model="#{dashboardManagedBean.chartModel}" style="height:500px;"/>

                    </p:panel>
                </p:dashboard>
        </div>

这是仪表板bean：

package com.journaldev.primefaces.beans;
import java.util.Date;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.context.FacesContext;

import org.primefaces.event.DashboardReorderEvent;
import org.primefaces.model.DashboardColumn;
import org.primefaces.model.DashboardModel;
import org.primefaces.model.DefaultDashboardColumn;
import org.primefaces.model.DefaultDashboardModel;
import org.primefaces.model.chart.*;

@ManagedBean
@SessionScoped
public class DashboardManagedBean {
    private DashboardModel model;
    private LineChartModel chartModel;
    public DashboardManagedBean() {
        // Initialize the dashboard model
        this.model = new DefaultDashboardModel();
        DashboardColumn column2 = new DefaultDashboardColumn();
        column2.addWidget("Finance");
        this.model.addColumn(column2);
        chartModel = new LineChartModel();
        chartModel.setTitle("Linear Chart");
        chartModel.setLegendPosition("e");
        chartModel.setZoom(true);

        LineChartSeries series1 = new LineChartSeries();
        series1.setLabel("Series 1");
        chartModel.addSeries(series1);
        Date date = new Date();
        double y = 0;
        for (int i=0;i<1000;i++){
            series1.set(date.getTime() +  1000*i,y);
            y+=Math.random();
        }

        DateAxis axis = new DateAxis("Dates");
        axis.setTickAngle(-50);
        axis.setTickFormat("%d.%m.%y %H:%#M:%S");
        axis.setMin("09.09.18 17:38:00");
        axis.setMax("09.09.18 18:00:00");
        axis.setTickCount(12);
        chartModel.getAxes().put(AxisType.X, axis);



    }

    public DashboardModel getModel() {
        return model;
    }

    public LineChartModel getChartModel() {
        return chartModel;
    }

    public void setModel(DashboardModel model) {
        this.model = model;
    }

}

package com.journaldev.primefaces.beans；
导入java.util.Date；
导入javax.faces.application.FacesMessage；
导入javax.faces.bean.ManagedBean；
导入javax.faces.bean.SessionScoped；
导入javax.faces.context.FacesContext；
导入org.primefaces.event.DashboardReorderEvent；
导入org.primefaces.model.DashboardColumn；
导入org.primefaces.model.DashboardModel；
导入org.primefaces.model.DefaultDashboardColumn；
导入org.primefaces.model.DefaultDashboardModel；
导入org.primefaces.model.chart.*；
@ManagedBean
@会议范围
公共类仪表板ManagedBean{
专用仪表盘模型；
私有线形图模型；
公共仪表板ManagedBean（）{
//初始化仪表板模型
this.model=新的DefaultDashboardModel（）；
DashboardColumn2=新的DefaultDashboardColumn（）；
第2栏：addWidget（“财务”）；
this.model.addColumn（第2列）；
chartModel=新的LineChartModel（）；
chartModel.setTitle（“线性图”）；
chartModel.setLegendPosition（“e”）；
chartModel.setZoom（true）；
LineChartSeries系列1=新的LineChartSeries（）；
系列1.设置标签（“系列1”）；
chartModel.addSeries（系列1）；
日期=新日期（）；
双y=0；
对于（int i=0；我在此展示：PrimeFaces正在重写他们所有的图表，以使用他们使用的旧Jquery图表库中的ChartsJ，该库在缩放和缩放方面存在问题。他们刚刚在PrimeFaces 6.2.9中发布了它，或者您可以从GitHub源代码构建6.3-SNAPSHOT。检查：这看起来可以工作，但我找不到6.2.9 on maven repository6.2.9仅适用于精英订户。如果你想测试这一点，你必须从GitHub源代码构建6.3-SNAPSHOT。primefaces的非精英用户的发布周期通常是什么？大约每6-9个月他们会发布一次主要版本。因此6.3最有可能在12月左右发布。