In this example, we will learn how to use MeterGaugeChartModel to display a meter gauge which updates with ajax polling.
<h:form> <p:chart id="cpu_gauge" type="metergauge" model="#{cpuUsageBean.meterGaugeModel}" style="width:400px;height:250px"/> <p:poll interval="1" update="cpu_gauge"/> </h:form>
@ManagedBean @ViewScoped public class CpuUsageBean { private AtomicInteger cpuUsage; private MeterGaugeChartModel gaugeModel; @PostConstruct public void init() { initCpuGaugeModel(); initCpuSimulator(); } private void initCpuGaugeModel() { gaugeModel = new MeterGaugeChartModel(); gaugeModel.setIntervals(Arrays.asList(20, 40, 60, 80, 100)); gaugeModel.setTitle("CPU Usage %"); gaugeModel.setSeriesColors("aa6666,bb6666,cc6666,dd6666,ee6666"); } private void initCpuSimulator() { cpuUsage = new AtomicInteger(50); ExecutorService es = Executors.newFixedThreadPool(1); es.execute(() -> { while (true) { int i = ThreadLocalRandom.current() .nextInt(-15, 16); int usage = cpuUsage.get(); usage += i; if (usage < 0) { usage = 0; } else if (usage > 100) { usage = 100; } cpuUsage.set(usage); try { TimeUnit.MILLISECONDS.sleep(500); } catch (InterruptedException e) { } } }); } public MeterGaugeChartModel getMeterGaugeModel() { gaugeModel.setValue(cpuUsage.get()); return gaugeModel; } }
To try examples, run embedded tomcat (configured in pom.xml of example project below):
mvn tomcat7:run-war
Dependencies and Technologies Used: