We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Syncfusion Feedback


Overview

JavaScript chart plot any type of data in a graph with the help of different chart axes types: numeric, category,date-time, date-time category, and logarithmic axis. And this chart axis elements can be customized further to make an axis more readable.


Chart Axis Types

Numeric axis

A numeric axis is used to represent numeric data in charts.

Numeric axis Documentation

Date-time axis

A date-time axis is used to represent dates in charts and displays dates as axis labels with different formats.

Date-time axis Documentation

Category axis

A category axis is used to represent non-numerical data in charts and displays text labels instead of numbers.

Category axis Documentation

Date-time category axis

A date-time category axis is used to display date values with nonlinear intervals to display business days by skipping holidays.

Logarithmic axis

A logarithmic scale is used to visualize data with both lower orders of magnitude (e.g., 10-6) and higher orders of magnitude (e.g., 106) in graphs.

Logarithmic axis Documentation


Multiple Axis

Plot different types of data against different axes in the same graph with the help of the multiple axes feature.

Multiple Axis Documentation


Chart Axis Crossing

Use axis crossing for any axis to cross with an associate axis for better visualization of data.

Chart Axis Crossing Documentation


Inversed Chart Axis

Reverse the axis labels and ticks. This swaps the higher and lower ranges of a chart axis.

Inversed Chart Axis Documentation


Opposed Axis

When the chart has multiple axes, this feature arranges the axes smartly by moving them to the opposite position from their default positions.

Opposed Axis Documentation


Synchronized Chart

Use multiple panes to show different types of data with multiple chart types and axis, for clear visualization.

Synchronized Chart Documentation


Smart Chart Axis Label

Avoids overlapping of chart axis labels by trimming, wrapping, rotating, hiding, or placing them on multiple rows.

Smart Axis Label Documentation


Multilevel Axis Labels

Organizes or groups data points in charts based on different categories.

Multilevel Axis Labels Documentation


Axis Label Rotation

Uses rotation to prevent chart axis labels from overlapping when the space for an axis is small.


Axis Label Position

Increase the space for rendering data points by moving the chart axis labels inside the plot area.

Axis Label Position Documentation


Smart Axis Range

Adds padding to the start and end ranges of a chart axis to avoid data cropping at the edges.


Chart Range Band

Draw special attention to any region of the chart or graph with the help of strip lines.

Horizontal Range Band

Allows to shadow different ranges in vertical axis with different colors to improve the readability of chart.

Horizontal Documentation

Vertical Range Band

Allows to shadow different ranges in for Horizontal axis with different colors to improve the readability of chart.

Vertical Documentation

Recurrence Range Band

Allows to shade the range repeatedly in an equal and regular interval.

Recurrence Documentation

Segment Range Band

Allows to shade a region of the chart with respect to segment.

Segment Documentation


85+ JAVASCRIPT UI CONTROLS

Scroll up icon