DayPilot.Calendar.getDate

Converts a vertical grid position to a date in a Calendar column.

Available in DayPilot Pro for JavaScript since 2026.4.7150.

Declaration

DayPilot.Calendar.getDate

Signature

getDate(top, precise?, isEnd?, column?): DayPilot.Date | null

Parameters

• top (number): grid-relative vertical pixels, excluding column headers.
• precise (boolean, default false): interpolate within the cell instead of snapping to its boundary.
• isEnd (boolean, default false): use the preceding interval at a shared pixel boundary; without precise conversion, return the cell end.
• column (DayPilot.Column, optional): target column; defaults to the first bottom-level column. Pass the column object, not its ID.

Return Value

A DayPilot.Date, or null when no column or visible cell is available. Coordinates use the time grid's content origin, not the browser page or current scroll viewport.

With 08:00–09:00 at 40 pixels followed by 10:00–11:30, getDate(40, false, false) returns 10:00 and getDate(40, false, true) returns 09:00. A precise negative coordinate extrapolates from the first cell; precise positions beyond the last cell resolve to the timeline end. Snapped conversion uses the last cell's start or end according to isEnd. Use getPixels for the reverse conversion.

Examples

Call this method after initialization. The following excerpts retain the existing Calendar configuration. The Nonlinear Timeline guide supplies a complete manual-axis example.

JavaScript

const result = calendar.getDate(40, true);
console.log(result);

Angular

<daypilot-calendar #calendar [config]="config"></daypilot-calendar>

import {ViewChild} from "@angular/core";
import {DayPilotCalendarComponent} from "daypilot-pro-angular";

@ViewChild("calendar") calendar!: DayPilotCalendarComponent;

inspect() {
  const result = this.calendar.control.getDate(40, true);
  console.log(result);
}

React

import {useState} from "react";
import {DayPilot, DayPilotCalendar} from "daypilot-pro-react";

const [calendar, setCalendar] = useState<DayPilot.Calendar | null>(null);
const inspect = () => {
  const result = calendar?.getDate(40, true);
  console.log(result);
};

<DayPilotCalendar controlRef={setCalendar} />

Vue

<script setup lang="ts">
import {ref} from "vue";
import {DayPilotCalendar} from "daypilot-pro-vue";

const calendar = ref<InstanceType<typeof DayPilotCalendar> | null>(null);
const inspect = () => {
  const result = calendar.value?.control.getDate(40, true);
  console.log(result);
};
</script>

<template>
  <DayPilotCalendar ref="calendar" />
</template>

See Also

Nonlinear Timeline · DayPilot.Calendar Class