Skip to main content

Calendar Charts

JavaScript Chart Types

Calendar Charts

Calendar charts provide a powerful visualization for time based data as well as a context aware date selection tool ideally suited to dashboards and selection interfaces to other JS Charting types. This all new type includes horizontal orientations, advanced calendar patterns and integrated heatmap support.

Calendar chart with two microcharts comparing values.
Using nest to group data by week and day of week. Then display the grouping sums on axis ticks using microcharts.
Demonstrates zooming calendar chart.
Calendar with a composite circular gauge microchart.
Calendar with blackout dates loaded from a CSV file.
Calendar heatmap chart based on CSV data with a dynamic title.
Calendar chart from CSV data file.
Calendar chart from CSV data using a specific formatting culture.
Custom ticks on a calendar chart and heatmap value formatting.
Calendar heatmap with microcharts and details chart based on CSV data.
An events calendar based on CSV data.
Calendar chart with events marked by a custom SVG path.
Update highlights using the FP API.
Calendar patterns applied to a year view calendar chart to display federal holidays over a number of years.
Calendar chart from CSV data file.
Lunar phase icons calendar chart loaded from CSV.
Calendar chart from CSV data file with custom smartPalette and axis ticks.
Events data loaded dynamically shown as dots with expanded view on click.
Events data loaded dynamically shown as dots with expanded view in tooltips.
A fully functional calendar date range picker with blackout dates loaded from CSV file.
A fully functional heatmap calendar date range picker that controls a line chart.
A simple date range picker with random heatmap data.
Daily step data loaded from CSV with a customized smartPalette.
Calendar heatmap with charts based on CSV data.
CSV activity data calendar chart using a customized smartPalette.
Calendar with week starting on monday.