Advanced JQuery Chart

jqxChart is an easy to use chart widget based on the popular jQuery library. It is written 100% in JavaScript and uses W3C standards like HTML5, CSS and SVG. jqxChart provides optimal chart rendering performance and high quality visualization across browsers and devices (PCs, Laptops, Tablets and Mobile phones). It automatically detects the browser capabilities and uses SVG or HTML5 rendering with hardware acceleration (when available) in modern browsers (IE9+, Firefox, Chrome, Opera) and VML rendering in IE8 and earlier browsers. The ability to render SVG, HTML5 and VML makes jqxChart an ideal choice for adding charting capabilities in your web sites and applications. No browser plug-ins are required. Try our Chart Studio - cloud solution for visual editing and hosting of interactive charts!

Highlights

• Chart Studio - cloud solution for visual editing and hosting of interactive charts
• 100% JavaScript HTML implementation
• Plug-in free
• Runs on mobile, touch devices and PCs
• Optimal rendering across browsers
• Web Standards Compliant
• Optimized for Performance
• Easy to use APIs
• Built-in color palettes
• Data binding to XML, CSV, TSV, JSON, JSONP

Unique features

jqxChart is part of the the jQWidgets UI Toolkit and delivers a combination of advanced features and capabilities for the next-generation of cloud-enabled Web Apps and modern Web sites. The chart works across platforms, devices and browsers and provides high quality plug-in free data visualization.

Data Binding

The jquery chart widget has a built-in data binding logic designed to support multiple data sources and handle large datasets. The chart supports several data binding modes optimized for the most common integration scenarios:

Local Data - requires minimal effort to load data from local array.
Xml Data - jQuery Chart can be loaded from XML data using Ajax request.
JSON Data - jQuery Chart can be loaded from JSON data using Ajax request.
CSV Data - jQuery Chart can be loaded from Comma-Delimited data using Ajax request.
Tab Data - jQuery Chart can be loaded from Tab-Delimited data using Ajax request.
Remote Data - You can populate the Chart using JSONP. JSONP (JSON with Padding) represents a JSON data wrapped in a function call. JSONP is an effective cross-domain communication technique used for bypassing the same-origin policy limitations.

Chart Types

jqxChart supports several common chart types. You can easily plot series of different types on a common chart. A type must be specified for each series group. Currently the chart supports the following series:

• column - a column chart is used to display series of grouped data with rectangular columns the size of which is proportional to the displayed data. The columns can be vertical or horizontal.
• stackedcolumn - stacked column chart
• stackedcolumn100 - percentage stacked columns
• line - a line chart is a type of chart used to connect a series of data points by straight line segments. It is one of the most widely used types of chart to represent trends over time.
• pie - a pie chart is used to display the data in a series as a circle divided into slices where the area of each slice is proportional to the values of the series.
• donut - a donut chart is a variation of the pie chart where the data is represented as a ring. JQWidgets JQuery donut chart supports different colors for each slice, animation and formatting of the labels.
• bar - a bar chart is a variation of the column chart where the colums are horizontal.
• candlestick - a candlestick chart is used in finance and is a way to represent open, high, low and close volumes per period.
• ohlc - an ohlc chart (Open High Low Close) is a type of chart used in finance to display the movements of price over time.
• bubble - a bubble chart is used to represent data with three dimensions where two of the values are plotted through the x and y location and the third through the size.
• scatter - a scatter chart is used to display values for two variables of a series through their coordinates. The values are represented as a collection of points.
• stackedline - stacked line chart
• stackedline100 - percentage stacked line chart
• spline - a spline chart is a varition of the line chart with smooth lines connecting the value points.
• stackedspline - stacked spline chart
• stackedspline100 - percentage stacked spline chart
• polar - a polar chart is used to represent data consisting of multiple variables on a two dimensional circular area using two or more shapes.
• spider - a spider chart is a varation of the polar chart. The difference is that the data is represented on a two dimensional spider web.
• area - an area chart is used to connect the value points with streight lines
• stacked area- a stacked area chart with streight lines between the points
• area spline - a smooth area chart connecting the value points
• waterfall - a waterfall chart is used to display the cumulative effect of sequential data.

Column Series

Stacked Column Series

Percentage Stacked Column Series

Chart Line Series

Chart Stacked Line Series

Chart Percentage Stacked Line Series

Spline Chart

Area Chart

Stacked Area Chart

Area Spline Chart

Multiple Chart Series

jQuery Chart with Negative Values

Works across devices and browsers

jqxChart takes the JavaScript, HTML UI development to a new level. It is platform independent, cross-browser compatible and works on PC and mobile devices.

Web Standards Compliant

Don't spend time testing on different devices and browsers. Use a reliable, CSS compliant JavaScript Chart widget based on jQuery, HTML5 and CSS3.

Optimized for Performance. Premium Visualization Quality

Small footprint, highly responsive, carefully optimized to deliver outstanding data visualization quality at optimal performance on a wide range of devices, operating systems and browsers.

Customization and Styling

jqxChart ships with eleven built-in color schemes which are used to automatically set colors for different series. The colors of the chart elements are 100% customizable, you can optionally enable and disable gradients, and all text styles and fonts can be change using standard CSS.