search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Background Color Time Wise

Asked by Taslim khan
4 months ago.

I'm coloring the background based on time data from the backend. The time range is defined as shift_IN_DATE_TIME: "2024-02-02T01:30:00" to shift_OUT_DATE_TIME: "2024-02-02T09:30:00". Currently, the background color spans from 1 to 10:00, covering the entire hour. However, I want the background color to only cover the period from 1:30 to 9:30.

i am using this in angular and below code

onBeforeCellRender: (args) => {

    const dp = this.scheduler.control;
    const component = this;
    const row = dp.rows.find(args.cell.resource);
    const shiftIN = new DayPilot.Date(row.data.shift_IN_DATE_TIME);
    const shiftOUT = new DayPilot.Date(row.data.shift_OUT_DATE_TIME);

    if (
        (args.cell.start > shiftIN && args.cell.start < shiftOUT) ||
        (args.cell.end > shiftIN && args.cell.end < shiftOUT)
    ) {
        args.cell.properties.backColor = "#ffdab9";
    } else {
        args.cell.properties.backColor = "white";
    }

},

below Attached Screenshot
please Help

Answer posted by Dan Letecky [DayPilot]
4 months ago.

You can take a look at this tutorial:

It explains how to set color for custom time segments in the Scheduler.

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.