带有JAX-RS和PrimeFaces的RESTful图表
通常，利用圖表提供數據的可視表示很有用。 PrimeFaces提供制圖解決方案，可輕松將數據的可視表示形式添加到Web和移動應用程序中。 如果將PrimeFaces圖表組件與RESTful Web服務數據結合使用，我們可以創建自定義圖表，以適合桌面和移動設備。
在本文中，我將更新Java EE 7動手練習MoviePlex應用程序，以提供一個儀表板，我們可以在其中集成PrimeFaces圖表組件。 在本示例中，我們將創建一個圖表，但是您可以利用本文幫助您以類似的方式構建更多圖表。 具體來說，我們將利用RESTful Web服務收集電影院的容量信息，并使用PrimeFaces條形圖顯示每個劇院的容量。
首先，請下載Java EE 7動手練習應用程序解決方案歸檔文件 （如果尚未下載）。 從那里，在NetBeans IDE中打開它。 要創建這篇文章，我正在使用NetBeans 8.0.2。 將項目導入到NetBeans中之后，通過右鍵單擊項目并選擇“運行”，將其部署到應用程序服務器（在我的情況下為GlasFish 4.1）。 部署完成后，通過打開以下URL在瀏覽器中打開Theater Web服務：http：// localhost：8080 / ExploringJavaEE7 / webresources / theater /。 該Web服務應產生一個與圖1類似的清單。
圖1：Theater Web Service XML
我們將利用此Web服務中的數據來提供儀表板小部件。 首先創建后端代碼，然后處理UI。 首先，通過右鍵單擊Source Packages，然后選擇“ New…”->“ Java Packages”，創建一個名為org.glassfish.movieplex7.jsf的新軟件包。 接下來，通過右鍵單擊該包并選擇“ New…”->“ JSF Managed Bean”，創建一個JSF Managed Bean控制器，并將其命名為DashboardController 。 讓我們將控制器注釋為@SessionScoped ，然后實現java.io.Serializable 。 在此控制器中，我們將獲取數據，并為儀表板構建模型。 我們將首先使用JAX-RS客戶端查詢Web服務，然后將利用數據填充Theater對象的列表。 因此，我們需要定義以下四個字段才能開始：
Client jaxRsClient; // Typically not hard coded...store in a properties file or database String baseUri = "http://localhost:8080/ExploringJavaEE7/webresources/theater/";private List<Theater> theaterList; private BarChartModel theaterCapacityModel;Client類型為javax.ws.rs.client.Client ，我們將通過調用javax.ws.rs.client.ClientBuilder來初始化類構造函數中的字段，如下所示：
public DashboardController() {jaxRsClient = ClientBuilder.newClient(); }接下來，我們需要創建一種方法來加載數據，創建和配置模型。 在我們的控制器中， init()方法基本上包含將任務委派給其他方法的實現。 init()方法的實現調用兩個方法： loadData()和createTheaterCapacityModel() 。
public void init() {loadData();createTheaterCapacityModel(); }編寫代碼是為了方便日后向我們的儀表板添加更多小部件。 loadData()方法提供了將數據從Web服務加載到本地列表的實現。
private void loadData() {theaterList = jaxRsClient.target(baseUri).request("application/xml").get(new GenericType>() {});}如果我們有更多的小部件，那么我們也將那些數據模型的數據加載代碼也添加到此方法中。 接下來，我們需要初始化已定義的org.primefaces.model.chart.BarChartModel ，并使用來自Web服務的數據加載它。 initTheaterCapacityModel()方法包含用于創建BarChartModel的實現，并用一個或多個ChartSeries對象填充它以構建數據。
public BarChartModel initTheaterCapacityModel() {BarChartModel model = new BarChartModel();ChartSeries theaterCapacity = new ChartSeries();theaterCapacity.setLabel("Capacities");for (Theater theater : theaterList) {theaterCapacity.set(theater.getId(), theater.getCapacity());}model.addSeries(theaterCapacity);return model; }如您所見，該模型由單個org.primefaces.model.chart.ChartSeries對象組成。 實際上，模型可以包含多個ChartSeries對象，并且將使用不同的彩色條在圖表中顯示該數據。 在這種情況下，我們只需將劇院ID和每個Theater對象的容量添加到ChartSeries對象，然后將其添加到BarChartModel 。 在我們的init()方法中調用createTheaterCapacityModel()方法，并在其中調用initTheaterCapacityModel()方法來創建org.primefaces.model.chart.BarChartModel ，然后進行相應的配置。
private void createTheaterCapacityModel() {theaterCapacityModel = initTheaterCapacityModel();theaterCapacityModel.setTitle("Theater Capacity");theaterCapacityModel.setLegendPosition("ne");theaterCapacityModel.setBarPadding(3);theaterCapacityModel.setShadow(false);Axis xAxis = theaterCapacityModel.getAxis(AxisType.X);xAxis.setLabel("Theater");Axis yAxis = theaterCapacityModel.getAxis(AxisType.Y);yAxis.setLabel("Capacity");yAxis.setMin(0);yAxis.setMax(200);}如您所見，在方法內部，我們通過調用initTheaterCapacityModel()初始化模型，然后通過一系列“設置”方法對其進行配置。 具體來說，我們設置標題，位置并提供一些視覺配置。 接下來，通過調用模型的getAxis()方法并傳遞X和Y軸常量來設置軸。 然后，通過為Y軸設置標簽和最小/最大值來配置每個軸。 請參閱本文末尾的課程的完整資源。
這樣做是針對服務器端代碼的，現在讓我們看一下用于顯示圖表組件的UI代碼。 首先，通過右鍵單擊并選擇"New..."-> "XHTML..." ，在項目的Web Pages文件夾的根目錄處生成一個新的XHTML文件，并將文件命名為dashboard.xhtml 。 dashboard.xhtml的源應包含以下內容：
<html xmlns:f="http://xmlns.jcp.org/jsf/core" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:p="http://primefaces.org/ui" xmlns="http://www.w3.org/1999/xhtml"><h:head><title>Theater Dashboard</title></h:head><h:body><f:event listener="#{dashboardController.initView}" type="preRenderView"/><h:form id="theaterDash" prependid="false"><p:growl id="growl" showdetail="true"/><p:layout fullpage="true"><p:layoutUnit position="center"><p:panel header="Capacity for Theaters" id="theater_capacity" style="border: 0px;"><p:chart model="#{dashboardController.theaterCapacityModel}" style="border: 0px; height: 200px; width: 500px;" type="bar"></p:chart></p:panel></p:layoutUnit></p:layout><p:poll interval="60" listener="#{dashboardController.pollData}"/></h:form></h:body> </html>相當簡單，JSF視圖包含PrimeFaces布局，包括面板和圖表。 在視圖頂部附近，使用了一個f：event標記來調用偵聽器方法，該方法在DashboardController類中實現，該類identified by initView() 。 出于本示例的目的， p:chart標簽是發生魔術的地方。 盡管可以使用其他選項（在http://www.primefaces.org/showcase），但在這種情況下，圖表類型設置為“條形”。 該模型設置為#{dashboardController.theaterCapacityModel} ，我們在控制器類中定義，填充和配置了該模型。 然后，我們提供寬度和高度，以使圖表很好地顯示。 萬一數據發生變化（我知道劇院的大小通常不會增加或減少，但是請與我一起去），我們添加了PrimeFaces民意測驗組件，調用pollData( ）方法，該組件會定期刷新數據。 在這種情況下，數據將每60秒刷新一次。 完成后，圖表應如圖2所示。
圖2：PrimeFaces條形圖
圖表是交互式的，如果單擊標簽，則條形圖將被隱藏。 如果您有多個類別（通過ChartSeries ），這將很方便。 您甚至可以在圖表組件中包含p:ajax標記，并在單擊圖表時調用一個動作…也許會彈出一個對話框，以顯示有關單擊的項目的一些其他數據。 做到了……現在您可以利用PrimeFaces和RESTful Web服務創建更多圖表。 我建議在MoviePlex應用程序的基礎上，看看還有其他可能性。 DashboardController類的完整源代碼：
package org.glassfish.movieplex7.jsf;import java.util.List; import javax.inject.Named; import javax.enterprise.context.SessionScoped; import javax.faces.component.UIComponent; import javax.faces.component.UIViewRoot; import javax.faces.context.FacesContext; import javax.ws.rs.client.Client; import javax.ws.rs.client.ClientBuilder; import javax.ws.rs.core.GenericType; import org.glassfish.movieplex7.entities.Theater;import org.primefaces.model.chart.Axis; import org.primefaces.model.chart.AxisType; import org.primefaces.model.chart.BarChartModel; import org.primefaces.model.chart.ChartSeries;/**** @author Juneau*/ @Named(value = "dashboardController") @SessionScoped public class DashboardController implements java.io.Serializable {Client jaxRsClient;// Typically not hard coded...store in a properties file or databaseString baseUri = "http://localhost:8080/ExploringJavaEE7/webresources/theater/";private List theaterList;private BarChartModel theaterCapacityModel;/*** Creates a new instance of FamisEquipPmChartController*/public DashboardController() {jaxRsClient = ClientBuilder.newClient();}public void init() {loadData();createTheaterCapacityModel();}/*** Initializes the view on page render...if we wish to grab a reference* to a panel, etc.*/public void initView(){UIViewRoot viewRoot = FacesContext.getCurrentInstance().getViewRoot();// Do something}public void pollData() {System.out.println("polling data...");loadData();}/*** JAX-RS client to poll the data*/private void loadData() {theaterList = jaxRsClient.target(baseUri).request("application/xml").get(new GenericType>() {});}/*** Initialize the Bar Chart Model for Displaying PM Estimated Hours by Month** @return*/public BarChartModel initTheaterCapacityModel() {BarChartModel model = new BarChartModel();ChartSeries theaterCapacity = new ChartSeries();theaterCapacity.setLabel("Capacities");for (Theater theater : theaterList) {theaterCapacity.set(theater.getId(), theater.getCapacity());}model.addSeries(theaterCapacity);return model;}private void createTheaterCapacityModel() {theaterCapacityModel = initTheaterCapacityModel();theaterCapacityModel.setTitle("Theater Capacity");theaterCapacityModel.setLegendPosition("ne");theaterCapacityModel.setBarPadding(3);theaterCapacityModel.setShadow(false);Axis xAxis = theaterCapacityModel.getAxis(AxisType.X);xAxis.setLabel("Theater");Axis yAxis = theaterCapacityModel.getAxis(AxisType.Y);yAxis.setLabel("Capacity");yAxis.setMin(0);yAxis.setMax(200);}/*** @return the theaterCapacityModel*/public BarChartModel getTheaterCapacityModel() {return theaterCapacityModel;}/*** @param theaterCapacityModel the theaterCapacityModel to set*/public void setTheaterCapacityModel(BarChartModel theaterCapacityModel) {this.theaterCapacityModel = theaterCapacityModel;}}翻譯自: https://www.javacodegeeks.com/2015/02/restful-charts-with-jax-rs-and-primefaces.html
總結
以上是生活随笔為你收集整理的带有JAX-RS和PrimeFaces的RESTful图表的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： linux的home目录在哪（linux
- 下一篇： Netty：另一种Web（套接字）服务器