v7.3.0

NonWorkingTime
Feature

Feature that allows styling of weekends (and other non-working time) by adding timeRanges for those days.

By default, the basic Scheduler's calendar is empty. When enabling this feature in the basic Scheduler, it injects Saturday and Sunday weekend intervals if no intervals are encountered. For Scheduler Pro, it visualizes the project calendar and does not automatically inject anything. You have to define a Calendar in the application and assign it to the project, for more information on how to do that, please see Scheduler Pro's Scheduling/Calendars guide.

Please note that to not clutter the view (and have a large negative effect on performance) the feature does not render ranges shorter than the base unit used by the time axis. The behavior can be disabled with hideRangesOnZooming config.

The feature also bails out of rendering ranges for very zoomed out views completely for the same reasons (see maxTimeAxisUnit for details).

Also note that the feature uses virtualized rendering, only the currently visible non-working-time ranges are available in the DOM.

This feature is disabled by default for Scheduler, but enabled by default for Scheduler Pro. For info on enabling it, see GridFeatures.

See also

No results

Configs

Configs are options you supply in a configuration object when creating an instance of this class
  • hideRangesOnZooming : Booleantrue

    The feature by default does not render ranges smaller than the base unit used by the time axis. Set this config to false to disable this behavior.

    The maxTimeAxisUnit config defines a zoom level at which to bail out of rendering ranges completely.

Properties

Properties are getters/setters or publicly accessible variables on this class

Functions

Functions are methods available for calling on the class

    CSS variables

    CSS variables that can be set to adjust appearance
    Name Description
    --b-non-working-time-background Non-working time background
    --b-non-working-time-header-background Non-working time header background
    --b-non-working-time-opacity Non-working time opacity
    --b-non-working-time-zindex Non-working time z-index
    id: nonWorkingTime

    Source path

    Scheduler/feature/NonWorkingTime.js

    Demo

    examples/nonworkingdays

    Contents