TagCloud displays a collection of tags with different strengths.
<div class="card">
<h:form>
<p:growl id="msgs" showDetail="true" skipDetailIfEqualsSummary="true"/>
<p:tagCloud model="#{tagCloudView.model}">
<p:ajax event="select" update="msgs" listener="#{tagCloudView.onSelect}"/>
</p:tagCloud>
</h:form>
</div>
@Named
@RequestScoped
public class TagCloudView {
private TagCloudModel model;
@PostConstruct
public void init() {
model = new DefaultTagCloudModel();
model.addTag(new DefaultTagCloudItem("design", 1));
model.addTag(new DefaultTagCloudItem("users", "#", 3));
model.addTag(new DefaultTagCloudItem("application", 2));
model.addTag(new DefaultTagCloudItem("quality", "#", 5));
model.addTag(new DefaultTagCloudItem("interface", 4));
model.addTag(new DefaultTagCloudItem("team", "#", 2));
model.addTag(new DefaultTagCloudItem("product", 5));
model.addTag(new DefaultTagCloudItem("data", 3));
model.addTag(new DefaultTagCloudItem("usability", "#", 4));
model.addTag(new DefaultTagCloudItem("experience", "#", 1));
}
public TagCloudModel getModel() {
return model;
}
public void onSelect(SelectEvent<TagCloudItem> event) {
TagCloudItem item = event.getObject();
FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Item Selected", item.getLabel());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
}