Scheduler Appearance

Tabs

Scheduler appearance is defined by HTML template - if inside there are some unnecessary buttons, you can simply remove them from template.

	<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
		<div class="dhx_cal_navline">
			<div class="dhx_cal_date"></div>
			<div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
			<div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
		</div>
		<div class="dhx_cal_header">
		</div>
		<div class="dhx_cal_data">
		</div>		
	</div>

Hiding all tabs

You need to change style of @dhx_cal_navline element inside template, and change the height settings of scheduler

	<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>
		<div class="dhx_cal_navline" style="display:none">
          scheduler.xy.nav_height = 0;

Size of scales

Height of x-scale

      scheduler.xy.scale_height = 40; //height of x-scale

Width of y-scale

      scheduler.xy.scale_width = 100; //width of y-scale

Custom size of event bars

<style type=“text/css” media=“screen”>

.dhx_cal_event_line {
	height:33px;
}

</style>

    scheduler.xy.bar_height = 40; //space reserved for single bar

Cascade event display

Events can be displayed as a cascade. It's possible to specify how many levels there should be and margin between them.

    scheduler.config.cascade_event_display = true; // to enable cascade rendering
    scheduler.config.cascade_event_count = 4; // how many levels (maximum) should be used
    scheduler.config.cascade_event_margin = 30; // margin in px between levels