Skip to main content

Calendar Charts

JavaScript Chart Types

  1. Home
  2. JavaScript Chart Types
  3. Calendar Charts

Calendar Charts

Back To Categories

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.

Multi Sparkline Comparison Calendar Chart
Calendar chart with two microcharts comparing values.
Microchart Ticks Calendar Chart
Using nest to group data by week and day of week. Then display the grouping sums on axis ticks using microcharts.
Zoomable Calendar Chart
Demonstrates zooming calendar chart.
Composite Circular Guage Calendar Chart
Calendar with a composite circular gauge microchart.
CSV Data Month Calendar Chart
Calendar with blackout dates loaded from a CSV file.
Sales Calendar Heatmap Chart
Calendar heatmap chart based on CSV data with a dynamic title.
CSV Calendar Heatmap Chart
Calendar chart from CSV data file.
Dynamic Cultures Calendar Chart
Calendar chart from CSV data using a specific formatting culture.
Custom Tick Calendar Chart
Custom ticks on a calendar chart and heatmap value formatting.
Master Detail Calendar Chart
Calendar heatmap with microcharts and details chart based on CSV data.
Event List Calendar Chart
An events calendar based on CSV data.
Exam List Calendar Chart
Calendar chart with events marked by a custom SVG path.
Pattern Highlights Calendar Chart
Update highlights using the FP API.
Yearly Holiday Calendar Patterns
Calendar patterns applied to a year view calendar chart to display federal holidays over a number of years.
Injuries CSV Data Heamap Calendar Chart
Calendar chart from CSV data file.
Monthly Lunar Phase Calendar Chart
Lunar phase icons calendar chart loaded from CSV.
NewPoint Selection Date Picker Chart
A date picker calendar chart that uses point selection to select any date across 20 years.
Ozone CSV Heatmap Calendar Chart
Calendar chart from CSV data file with custom smartPalette and axis ticks.
Event Planner Details Calendar Chart
Events data loaded dynamically shown as dots with expanded view on click.
Event Tooltip Details Calendar Chart
Events data loaded dynamically shown as dots with expanded view in tooltips.
CSV Blackout Days Date Range Picker Chart
A fully functional calendar date range picker with blackout dates loaded from CSV file.
CSV Heatmap Date Range Picker Chart
A fully functional heatmap calendar date range picker that controls a line chart.
Date Range Picker Calendar Chart
A simple date range picker with random heatmap data.
NewScrollable Calendar HTML Chart
Calendar chart used with HTML to create a scrollable chart area.
Steps Activity Calendar Heatmap Chart
Daily step data loaded from CSV with a customized smartPalette.
NewDay Details View Calendar Chart
Month calendar events with detailed day view.
Weather Sparkline Calendar Chart
Calendar heatmap with charts based on CSV data.
Week Activity Calendar Heatmap Chart
CSV activity data calendar chart using a customized smartPalette.
Start Day of Week Calendar Chart
Calendar with week starting on monday.

See also Calendar Chart Tutorial