Question

我想尝试一下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;
    }

}

我得到的结果看起来大多不错。当我尝试放大图表时，问题就开始出现了，然后它真的被磨损了： Zoomed Chart

所以我对质数图有多个担忧：

为什么我选择的主题不适用？我安装了maven依赖项并将其添加到web.xml中。对于仪表板的其余部分，它似乎可以解决问题。
为什么缩放行为如此怪异？
xmin和xmax的折线图上是否真的没有自动缩放功能？

感谢您提供绝对的primefaces新手。

Primefaces图表缩放和主题行为

0 个答案: