Text on duration bar

1. You need to increase the height of the duration bar. The height is defined using CSS and you need to override the default style. It's defined using two elements, .scheduler_default_bar and .scheduler_default_bar_inner (this applies to the built-in theme).

<style type="text/css">

/* outer duratin bar div */
#dp .scheduler_default_event_bar {
  height: 15px;
}

/* inner duration bar div */
#dp .scheduler_default_event_bar_inner {
  height: 15px;
}

/* increase the padding on the inner event div */
#dp .scheduler_default_event_inner {
  padding-top: 15px;
}
</style>

The default height is 4px. You can override the built-in theme by using a more specific selector (e.g. using #dp, where "dp" is the placeholder div id).

2. Insert an active area at the top of the event and specify the text using "html" property:

dp.onBeforeEventRender = function(args) {
args.data.areas = [
{left: 0, right: 0, top: 0, height: 15, html: "My text"}
];
};

See also:
https://doc.daypilot.org/scheduler/event-active-areas/

Thanks for the answer.