PrimeFaces 饼图

2025 年 3 月 17 日 | 阅读 1 分钟

它是一种图表类型，其中一个圆被分成多个扇形，每个扇形代表一些统计数据。它是一种以图形方式表示统计数据的方法。

<p:chart> 组件用于创建图表。在这里，我们需要设置 type = "pie" 来创建饼图。它使用图表组件的所有属性，这些属性已在上一章中讨论过。

示例

在下面的示例中，我们将实现 <p:chart> 组件来创建饼图。此示例包含以下文件。

JSF 文件

// pieChart.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>PieChart</title>
</h:head>
<h:body>
<p:chart type="pie" model="#{pieChart.pieModel}" style="width:400px;height:300px" />
</h:body>
</html>

ManagedBean

// PieChart.java

package com.javatpoint;
import javax.annotation.PostConstruct;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import org.primefaces.model.chart.PieChartModel;
@ManagedBean
public class PieChart implements Serializable {
private PieChartModel pieModel;
@PostConstruct
public void init() {
createPieModels();
}
public PieChartModel getPieModel() {
return pieModel;
}
private void createPieModels() {
createPieModel();
}
private void createPieModel() {
pieModel = new PieChartModel();
pieModel.set("Mercedess", 700);
pieModel.set("BMW", 300);
pieModel.set("Volvo", 400);
pieModel.setTitle("Car Brands");
pieModel.setLegendPosition("c");
}
}

输出

下一个主题PrimeFaces Growl

PrimeFaces 饼图

示例

JSF 文件

ManagedBean

联系信息

关注我们

教程

面试题

在线编译器

Python

Java

.Net Framework

AI, ML and Data Science

Cloud Technology

B.Tech and MCA

Web Technology

PHP

Software Testing

Technical Interview

Java Interview

Python

Web Interview

Database Interview

B.Tech / MCA

Important Interview

Software Testing Interview

Company Interviews

Online Compilers

Multiple Choice Questions

PrimeFaces 教程

PrimeFaces Ajax

UI 组件

面试题

PrimeFaces 饼图

示例

JSF 文件

ManagedBean

相关帖子

PF Keyboard

PF ConfirmDialog

PF SelectManyCheckbox

PF Button

PF AreaChart

PF Editor

PF Toolbar

PF MenuBar

PF BreadCrumb

PF ColorPicker

订阅 Tpoint Tech

联系信息

关注我们

教程

面试题

在线编译器