Skip to content

Calendar

The Calendar Chart visualizes numerical data across a time-based calendar layout.
Each day is represented as a cell, color-coded based on its corresponding value.
This chart is perfect for detecting seasonality, activity patterns, and high/low occurrences within a timeline.

Use cases:

  • Activity logs (logins, transactions, errors per day)
  • Heat maps of sales or user activity by date
  • Productivity patterns across months or years
  • Visualizing server load or site visits daily over time

⚙️ Setup

  1. Drag the Calendar Chart widget from the chart library onto your designer workspace.
  2. Select the chart.
  3. Go to the Widget Configuration tab in the Configuration panel.
  4. Under the Configuration panel tab, select the Basic Configuration option to access essential settings.
  5. Choose the Source to fetch data for the chart.
  6. Map:
    • Measure — The numeric value to be represented by color.
    • Date — The date field associated with each value.

📊 Basic Configuration

Configuration ItemDescription
SourceThe data source for your calendar values.
MeasureNumeric value to visualize by color intensity.
DateDate field for placing values on the calendar layout.

🎨 Chart Customizations

CategoryOptions & Description
GeneralTheme, background, accessibility settings.
TitleChart title, font, alignment.
GridChart margins and layout spacing.
TooltipDisplay value info on hover.
HeatMapControl color range, visual map, and intensity scales.
CalendarOrientation (horizontal/vertical), splitting by Year/Month/None, cell sizing, and spacing between calendars.

📊 Example Visualization

Calendar chart