The chart component can be used to display data in a variety of forms and styles.
<?xml version="1.0" encoding="UTF-8"?> // MPL License text (see http://www.mozilla.org/MPL/) <ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:ace="http://www.icefaces.org/icefaces/components" xmlns:ice="http://www.icesoft.com/icefaces/component" xmlns:ui="http://java.sun.com/jsf/facelets" template="/resources/templates/content-template.xhtml"> <ui:param name="title" value="#{msgs[chartBean.title]}"/> <ui:param name="description" value="#{msgs[chartBean.description]}"/> <ui:param name="subMenuTitle" value="#{msgs[chartBean.subMenuTitle]}"/> <ui:param name="subMenuLinks" value="#{chartBean.subMenuLinks}"/> <ui:param name="resourceValue" value="#{chartBean.exampleResource}"/> <ui:param name="wikiResources" value="#{chartResources.wikiResources}"/> <ui:param name="tldResources" value="#{chartResources.tldResources}"/> <ui:define name="example"> <h:form id="canvasForm"> <ace:chart id="chart" animated="false" value="#{chartBean.barData}" stackSeries="false" defaultAxesConfig="#{chartBean.barDemoDefaultAxis}" xAxis="#{chartBean.barDemoXAxis}" yAxis="#{chartBean.barDemoYAxis}" legend="true" legendPlacement="OUTSIDE_GRID" highlighter="true" highlighterLocation="N" highlighterShowMarker="false" highlighterBringSeriesToFront="true" widgetVar="barChart" /> </h:form> </ui:define> </ui:composition>
/* MPL License text (see http://www.mozilla.org/MPL/) */ package org.icefaces.samples.showcase.example.ace.chart; import org.icefaces.ace.component.chart.Axis; import org.icefaces.ace.component.chart.AxisType; import org.icefaces.ace.model.chart.CartesianSeries; import org.icefaces.samples.showcase.metadata.annotation.*; import org.icefaces.samples.showcase.metadata.context.ComponentExampleImpl; import javax.annotation.PostConstruct; import javax.faces.bean.CustomScoped; import javax.faces.bean.ManagedBean; import java.io.Serializable; import java.util.ArrayList; import java.util.List; import java.util.Random; @ComponentExample( title = "example.ace.chart.title", description = "example.ace.chart.description", example = "/resources/examples/ace/chart/chart.xhtml" ) @ExampleResources( resources ={ // xhtml @ExampleResource(type = ResourceType.xhtml, title="Chart.xhtml", resource = "/resources/examples/ace/chart/chart.xhtml"), // Java Source @ExampleResource(type = ResourceType.java, title="ChartBean.java", resource = "/WEB-INF/classes/org/icefaces/samples/showcase/example/ace/chart/ChartBean.java") } ) @Menu( title = "menu.ace.chart.subMenu.title", menuLinks = { @MenuLink(title = "menu.ace.chart.subMenu.main", isDefault = true, exampleBeanName = ChartBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.bar", exampleBeanName = ChartBarBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.bubble", exampleBeanName = ChartBubbleBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.candlestick", exampleBeanName = ChartCandlestickBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.donut", exampleBeanName = ChartDonutBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.gauge", exampleBeanName = ChartGaugeBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.line", exampleBeanName = ChartLineBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.pie", exampleBeanName = ChartPieBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.combined", exampleBeanName = ChartCombinedBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.color", exampleBeanName = ChartColorBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.dynamic", exampleBeanName = ChartDynamicBean.BEAN_NAME), @MenuLink(title = "menu.ace.chart.subMenu.export", exampleBeanName = ChartExportBean.BEAN_NAME) } ) @ManagedBean(name= ChartBean.BEAN_NAME) @CustomScoped(value = "#{window}") public class ChartBean extends ComponentExampleImpl<ChartBean> implements Serializable { public static final String BEAN_NAME = "chartBean"; private Random randomizer = new Random(System.currentTimeMillis()); private CartesianSeries barData = new CartesianSeries() {{ setType(CartesianType.BAR); add("HDTV Receiver", randomizer.nextInt(20)); add("Cup Holder Pinion Bob", randomizer.nextInt(20)); add("Generic Fog Lamp", randomizer.nextInt(20)); add("8 Track Control Module", randomizer.nextInt(20)); add("Sludge Pump Fourier Modulator", randomizer.nextInt(20)); add("Transceiver Spice Rack", randomizer.nextInt(20)); add("Hair Spray Danger Indicator", randomizer.nextInt(20)); setLabel("Product / Sales"); }}; private Axis barDemoDefaultAxis = new Axis() {{ setTickAngle(-30); }}; private Axis barDemoXAxis = new Axis() {{ setType(AxisType.CATEGORY); }}; private Axis barDemoYAxis = new Axis() {{ setAutoscale(true); setTickInterval("5"); setLabel("USD Millions"); }}; private Axis barDemoXTwoAxis = new Axis() {{ setTicks(new String[] {"Nickle", "Aluminum", "Xenon", "Silver", "Sulfur", "Silicon", "Vanadium"}); setType(AxisType.CATEGORY); }}; public CartesianSeries getBarData() { return barData; } public void setBarData(CartesianSeries barData) { this.barData = barData; } public Axis getBarDemoXAxis() { return barDemoXAxis; } public void setBarDemoXAxis(Axis barDemoXAxis) { this.barDemoXAxis = barDemoXAxis; } public Axis getBarDemoDefaultAxis() { return barDemoDefaultAxis; } public void setBarDemoDefaultAxis(Axis barDemoDefaultAxis) { this.barDemoDefaultAxis = barDemoDefaultAxis; } public Axis getBarDemoXTwoAxis() { return barDemoXTwoAxis; } public void setBarDemoXTwoAxis(Axis barDemoXTwoAxis) { this.barDemoXTwoAxis = barDemoXTwoAxis; } public Axis getBarDemoYAxis() { return barDemoYAxis; } public void setBarDemoYAxis(Axis barDemoYAxis) { this.barDemoYAxis = barDemoYAxis; } public ChartBean() { super(ChartBean.class); } @PostConstruct public void initMetaData() { super.initMetaData(); } }