Skip to content

hatemalimam/ChartistJSF

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

66 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ChartistJSF


ChartistJSF, Highly Customizable Responsive Charts for JavaServer Faces.

ChartistJSF-Line ChartistJSF-Bar

Overview


ChartistJSF is based on Chartist.js charts, which is a product of a community that was disappointed about the abilities provided by other charting libraries. The components are built on top of PrimeFaces providing the maximum harmony in todays modern JSF applications.

Facts


  • Great flexibility while using clear separation of concerns (Style with CSS & control with JS)
  • Usage of SVG (Yes! SVG is the future of illustration in web!)
  • Fully responsive and DPI independent
  • Responsive configuration with media queries
  • Fully compatible with JSF, PrimeFaces components, and AJAX updates.

Why ChartistJSF and Not PrimeFaces Charts


PrimeFaces relies on jqPlot to draw the charts, jqPlot uses canvas for drawing the charts which limits the full control over the generated DOM elements, therefore styling and full controls can be a headache.

From that point the necessity for another Chart library came into the way (along-side PrimeFaces), ChartistJSF relies on Chartist.js to generate the Chart elements in pure SVG, the SVG charts are defined in XML. As a result, every SVG element is appended to the Document Object Model (DOM) and can be manipulated using a combination of JavaScript and CSS. Moreover, you can attach an event handlers to a SVG element or update its properties based on another document event. Canvas, on the other hand, is a simple graphics API. It draws pixels and nothing more.

Responsive is built in mind from the start and with media-queries it's easy to control each case apart.

Getting Started


ChartistJSF can be downloaded manually or via maven.

Downloads
Version Binary Source PrimeFaces Version
3.0 Download Download 6.x
1.0 Download Download 5.x
Maven

PrimeFaces 7.x

<dependency>
	<groupId>org.chartistjsf</groupId>
	<artifactId>ChartistJSF</artifactId>
	<version>4.0</version>		
</dependency>

PrimeFaces 6.x

<dependency>
	<groupId>org.chartistjsf</groupId>
	<artifactId>ChartistJSF</artifactId>
	<version>3.0</version>		
</dependency>

PrimeFaces 5.x

<dependency>
	<groupId>org.chartistjsf</groupId>
	<artifactId>ChartistJSF</artifactId>
	<version>1.0</version>		
</dependency>

Usage


Namespace
xmlns:ct="http://www.chartistjsf.org/charts"
Component
<ct:chart type="line" model="#{mainBean.lineModel}">
</ct:chart>


Please refer to the showcase website in order to see the full usage.

Contribution


You are very welcome to contribute to this project, just fork and let me know :)

Developers


License


Licensed under the Apache License, Version 2.0 (the "License") http://www.apache.org/licenses/LICENSE-2.0

NOTICE