本文概述
它是线形图的定制和高级版本, 其中填充了系列。它用于以图形方式表示统计数据。 <p:chart>是在JSF应用程序中创建图表的通用组件。我们可以设置图表类型以指定pf图表的类型。
图表具有下表列出的各种属性。这些属性是通用属性, 适用于所有类型的图表。
图表属性
Attribute | Default value | Type | Description |
---|---|---|---|
id | null | String | 它是组件的唯一标识符。 |
rendered | true | Boolean | 它需要布尔值来指定组件的呈现。 |
type | null | String | 用于指定图表的类型。 |
model | null | ChartModel | 用于设置数据和设置的模型对象。 |
style | null | String | 用于设置组件的内联样式。 |
widgetVar | null | String | 它是客户端小部件的名称。 |
responsive | false | Boolean | 在响应模式下, 调整窗口大小时将重新绘制图表。 |
例子
在下面的示例中, 我们正在实现<p:chart>组件。本示例包含以下文件。
JSF文件
// area.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Area</title>
</h:head>
<h:body>
<p:chart type="line" model="#{area.drawArea}" style="height:300px" />
</h:body>
</html>
ManagedBean
// Area.java
package com.srcmini;
import javax.annotation.PostConstruct;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import org.primefaces.model.chart.Axis;
import org.primefaces.model.chart.AxisType;
import org.primefaces.model.chart.CategoryAxis;
import org.primefaces.model.chart.LineChartModel;
import org.primefaces.model.chart.LineChartSeries;
@ManagedBean
public class Area implements Serializable {
private LineChartModel drawArea;
@PostConstruct
public void init() {
createDrawArea();
}
public LineChartModel getDrawArea() {
return drawArea;
}
private void createDrawArea() {
drawArea = new LineChartModel();
LineChartSeries boys = new LineChartSeries();
boys.setFill(true);
boys.setLabel("Boys");
boys.set("2010", 140);
boys.set("2011", 120);
boys.set("2012", 64);
boys.set("2013", 170);
boys.set("2014", 45);
LineChartSeries girls = new LineChartSeries();
girls.setFill(true);
girls.setLabel("Girls");
girls.set("2010", 72);
girls.set("2011", 80);
girls.set("2012", 130);
girls.set("2013", 110);
girls.set("2014", 140);
drawArea.addSeries(boys);
drawArea.addSeries(girls);
drawArea.setTitle("Area Chart");
drawArea.setLegendPosition("ne");
drawArea.setStacked(true);
drawArea.setShowPointLabels(true);
Axis xAxis = new CategoryAxis("Years");
drawArea.getAxes().put(AxisType.X, xAxis);
Axis yAxis = drawArea.getAxis(AxisType.Y);
yAxis.setLabel("Births");
yAxis.setMin(0);
yAxis.setMax(300);
}
}
输出
评论前必须登录!
注册