如何动态更新 p:chart
How to update a p:chart dynamically
我想在饼图中动态显示数据库中的数据。只显示数据,没问题,但如果数字增加,饼图 update.I 不知道如何更新图表。我使用 PrimeFaces 库。
所以这是我解决这个问题的主要代码:
@ManagedBean
public class Chart implements Serializable {
private static final long serialVersionUID = 1L;
private PieChartModel pieModel1;
private int n = 0;
private int j = 0;
private int s = 0;
private List<Erfasst> erfassungen;
private EntityManagerFactory emf = Persistence
.createEntityManagerFactory("CP Kontrolle");
@PostConstruct
public void init() {
createPieModels();
}
private void createPieModels() {
pieModel1 = new PieChartModel();
EntityManager em = emf.createEntityManager();
Query q = em.createQuery("SELECT e FROM Erfasst e");
erfassungen = q.getResultList();
for (Erfasst erf : erfassungen) {
if (erf.getRechtsform().equals("natürliche Person")) {
n++;
} else if (erf.getRechtsform().equals("juristische Person")) {
j++;
} else {
s++;
}
}
pieModel1.set("natürliche Personen", n);
pieModel1.set("juristische Personen", j);
pieModel1.set("sonstige", s);
pieModel1.setTitle("Erfassungen gesamt");
pieModel1.setLegendPosition("e");
pieModel1.setFill(false);
pieModel1.setShowDataLabels(true);
pieModel1.setDiameter(150);
}
public PieChartModel getPieModel1() {
return pieModel1;
}
}
在视图方面:
<p:chart type="pie"
model="#{chart.pieModel1}"
style="width:400px;height:300px"
styleClass="chartPie" id="aufstellung" />
它在默认配置下不会自动更新(您必须更新它 "manually")。但是,您可以将图表与 PrimePush (websocket) 结合使用。
PF showcase 就是一个很好的例子:http://www.primefaces.org/showcase/push/chart.xhtml(推图)
我想在饼图中动态显示数据库中的数据。只显示数据,没问题,但如果数字增加,饼图 update.I 不知道如何更新图表。我使用 PrimeFaces 库。
所以这是我解决这个问题的主要代码:
@ManagedBean
public class Chart implements Serializable {
private static final long serialVersionUID = 1L;
private PieChartModel pieModel1;
private int n = 0;
private int j = 0;
private int s = 0;
private List<Erfasst> erfassungen;
private EntityManagerFactory emf = Persistence
.createEntityManagerFactory("CP Kontrolle");
@PostConstruct
public void init() {
createPieModels();
}
private void createPieModels() {
pieModel1 = new PieChartModel();
EntityManager em = emf.createEntityManager();
Query q = em.createQuery("SELECT e FROM Erfasst e");
erfassungen = q.getResultList();
for (Erfasst erf : erfassungen) {
if (erf.getRechtsform().equals("natürliche Person")) {
n++;
} else if (erf.getRechtsform().equals("juristische Person")) {
j++;
} else {
s++;
}
}
pieModel1.set("natürliche Personen", n);
pieModel1.set("juristische Personen", j);
pieModel1.set("sonstige", s);
pieModel1.setTitle("Erfassungen gesamt");
pieModel1.setLegendPosition("e");
pieModel1.setFill(false);
pieModel1.setShowDataLabels(true);
pieModel1.setDiameter(150);
}
public PieChartModel getPieModel1() {
return pieModel1;
}
}
在视图方面:
<p:chart type="pie"
model="#{chart.pieModel1}"
style="width:400px;height:300px"
styleClass="chartPie" id="aufstellung" />
它在默认配置下不会自动更新(您必须更新它 "manually")。但是,您可以将图表与 PrimePush (websocket) 结合使用。
PF showcase 就是一个很好的例子:http://www.primefaces.org/showcase/push/chart.xhtml(推图)