@syncfusion/ej2-gantt 19.4.55 → 20.1.47-1460716

package/src/gantt/models/timeline-settings-model.d.ts

@@ -1,4 +1,4 @@
-import { Property, ChildProperty, Complex } from '@syncfusion/ej2-base';import { TimelineViewMode } from '../base/enum';import { ITimelineFormatter } from '../base/interface';
+import { Property, ChildProperty, Complex } from '@syncfusion/ej2-base';
 
 /**
  * Interface for a class TimelineTierSettings
@@ -6,39 +6,39 @@ import { Property, ChildProperty, Complex } from '@syncfusion/ej2-base';import {
 export interface TimelineTierSettingsModel {
 
     /**
-     * Defines timeline cell format.
-     *
-     * @default ''
-     */
-    format?: string;
+     * Defines timeline cell format.
+     *
+     * @default ''
+     */
+    format?: string;
 
     /**
-     * Defines timeline mode of Gantt header.
-     * * `None` - Default.
-     * * `Week` - Define the week mode header.
-     * * `Day` - Define the day mode header.
-     * * `Hour` - Define the hour mode header.
-     * * `Month` - Define the month mode header.
-     * * `Year` - Define the year mode header.
-     * * `Minutes` - Define the minutes mode header.
-     *
-     * @default 'None'
-     */
-    unit?: TimelineViewMode;
+     * Defines timeline mode of Gantt header.
+     * * `None` - Default.
+     * * `Week` - Define the week mode header.
+     * * `Day` - Define the day mode header.
+     * * `Hour` - Define the hour mode header.
+     * * `Month` - Define the month mode header.
+     * * `Year` - Define the year mode header.
+     * * `Minutes` - Define the minutes mode header.
+     *
+     * @default 'None'
+     */
+    unit?: TimelineViewMode;
 
     /**
-     * Defines number of timeline units combined for single cell.
-     *
-     * @default 1
-     */
-    count?: number;
+     * Defines number of timeline units combined for single cell.
+     *
+     * @default 1
+     */
+    count?: number;
 
     /**
-     * Defines method to get custom formatted values of timeline cells.
-     *
-     * @default null
-     */
-    formatter?: string | ITimelineFormatter;
+     * Defines method to get custom formatted values of timeline cells.
+     *
+     * @default null
+     */
+    formatter?: string | ITimelineFormatter;
 
 }
 
@@ -48,62 +48,62 @@ export interface TimelineTierSettingsModel {
 export interface TimelineSettingsModel {
 
     /**
-     * Defines timeline mode of Gantt header.
-     * * `None` - Default.
-     * * `Week` - Define the week mode header.
-     * * `Day` - Define the day mode header.
-     * * `Hour` - Define the hour mode header.
-     * * `Month` - Define the month mode header.
-     * * `Year` - Define the year mode header.
-     * * `Minutes` - Define the minutes mode header.
-     *
-     * @default 'None'
-     */
-    timelineViewMode?: TimelineViewMode;
+     * Defines timeline mode of Gantt header.
+     * * `None` - Default.
+     * * `Week` - Define the week mode header.
+     * * `Day` - Define the day mode header.
+     * * `Hour` - Define the hour mode header.
+     * * `Month` - Define the month mode header.
+     * * `Year` - Define the year mode header.
+     * * `Minutes` - Define the minutes mode header.
+     *
+     * @default 'None'
+     */
+    timelineViewMode?: TimelineViewMode;
 
     /**
-     * Defines top tier setting in timeline.
-     */
-    topTier?: TimelineTierSettingsModel;
+     * Defines top tier setting in timeline.
+     */
+    topTier?: TimelineTierSettingsModel;
 
     /**
-     * Defines bottom tier settings in timeline.
-     */
-    bottomTier?: TimelineTierSettingsModel;
+     * Defines bottom tier settings in timeline.
+     */
+    bottomTier?: TimelineTierSettingsModel;
 
     /**
-     * Defines width of timeline cell.
-     *
-     * @default 33
-     */
-    timelineUnitSize?: number;
+     * Defines width of timeline cell.
+     *
+     * @default 33
+     */
+    timelineUnitSize?: number;
 
     /**
-     * Defines week start day in timeline.
-     *
-     * @default 0
-     */
-    weekStartDay?: number;
+     * Defines week start day in timeline.
+     *
+     * @default 0
+     */
+    weekStartDay?: number;
 
     /**
-     * Defines background color of weekend cell in week - day timeline mode.
-     *
-     * @default null
-     */
-    weekendBackground?: string;
+     * Defines background color of weekend cell in week - day timeline mode.
+     *
+     * @default null
+     */
+    weekendBackground?: string;
 
     /**
-     * Enables or disables tooltip for timeline cells.
-     *
-     * @default true
-     */
-    showTooltip?: boolean;
+     * Enables or disables tooltip for timeline cells.
+     *
+     * @default true
+     */
+    showTooltip?: boolean;
 
     /**
-     * Enables or disables timeline auto update on editing action.
-     *
-     * @default true
-     */
-    updateTimescaleView?: boolean;
+     * Enables or disables timeline auto update on editing action.
+     *
+     * @default true
+     */
+    updateTimescaleView?: boolean;
 
 }

package/src/gantt/models/timeline-settings.js

@@ -1,22 +1,22 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 import { Property, ChildProperty, Complex } from '@syncfusion/ej2-base';
 /**
  * Configures timeline settings of Gantt.

package/src/gantt/models/tooltip-settings-model.d.ts

@@ -1,4 +1,4 @@
-import { Property, ChildProperty } from '@syncfusion/ej2-base';
+import { Property, ChildProperty } from '@syncfusion/ej2-base';
 
 /**
  * Interface for a class TooltipSettings
@@ -6,38 +6,38 @@ import { Property, ChildProperty } from '@syncfusion/ej2-base';
 export interface TooltipSettingsModel {
 
     /**
-     * Enables or disables tooltip of Gantt element.
-     *
-     * @default true
-     */
-    showTooltip?: boolean;
+     * Enables or disables tooltip of Gantt element.
+     *
+     * @default true
+     */
+    showTooltip?: boolean;
 
     /**
-     * Defines tooltip template for taskbar elements.
-     *
-     * @default null
-     */
-    taskbar?: string;
+     * Defines tooltip template for taskbar elements.
+     *
+     * @default null
+     */
+    taskbar?: string;
 
     /**
-     * Defines template for baseline tooltip element.
-     *
-     * @default null
-     */
-    baseline?: string;
+     * Defines template for baseline tooltip element.
+     *
+     * @default null
+     */
+    baseline?: string;
 
     /**
-     * Defines template for dependency line tooltip.
-     *
-     * @default null
-     */
-    connectorLine?: string;
+     * Defines template for dependency line tooltip.
+     *
+     * @default null
+     */
+    connectorLine?: string;
 
     /**
-     * Defines tooltip template for taskbar editing action.
-     *
-     * @default null
-     */
-    editing?: string;
+     * Defines tooltip template for taskbar editing action.
+     *
+     * @default null
+     */
+    editing?: string;
 
 }

package/src/gantt/models/tooltip-settings.js

@@ -1,22 +1,22 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 import { Property, ChildProperty } from '@syncfusion/ej2-base';
 /**
  * Configures tooltip settings for Gantt.

package/src/gantt/renderer/chart-rows.js

@@ -1,16 +1,16 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 import { createElement, isNullOrUndefined, extend, compile, getValue, setValue } from '@syncfusion/ej2-base';
 import { formatUnit, addClass } from '@syncfusion/ej2-base';
 import { isScheduledTask } from '../base/utils';
@@ -28,7 +28,7 @@ var ChartRows = /** @class */ (function (_super) {
         _this.milestoneHeight = 0;
         _this.milesStoneRadius = 0;
         _this.baselineTop = 0;
-        _this.baselineHeight = 3;
+        _this.baselineHeight = 8;
         _this.touchLeftConnectorpoint = '';
         _this.touchRightConnectorpoint = '';
         _this.dropSplit = false;
@@ -111,7 +111,7 @@ var ChartRows = /** @class */ (function (_super) {
      * @private
      */
     ChartRows.prototype.getIndicatorNode = function (indicator) {
-        var templateString = '<label class="' + cls.label + ' ' + cls.taskIndicatorDiv + '"  style="line-height:'
+        var templateString = '<label class="' + cls.label + ' ' + cls.taskIndicatorDiv + '" role="LabelIndicator" style="line-height:'
             + (this.parent.rowHeight) + 'px;' +
             'left:' + this.getIndicatorleft(indicator.date) + 'px;"><i class="' + indicator.iconClass + '"></i> </label>';
         return this.createDivElement(templateString);
@@ -184,9 +184,9 @@ var ChartRows = /** @class */ (function (_super) {
                 }
                 else {
                     taskLabel = '<span class="' + cls.taskLabel + '" style="line-height:' +
-                        (this.taskBarHeight - 1) + 'px; text-align:' + (this.parent.viewType === 'ResourceView' ? 'left;' : ';') +
-                        'display:' + (this.parent.viewType === 'ResourceView' ? 'inline-flex;' : ';') +
-                        'width:' + (this.parent.viewType === 'ResourceView' ? (data.ganttProperties.width - 10) : '') + 'px; height:' +
+                        (this.taskBarHeight - 1) + 'px;' + (this.parent.viewType === 'ResourceView' ? 'text-align: left;' : '') +
+                        +(this.parent.viewType === 'ResourceView' ? 'display:inline-flex;' : '') +
+                        +(this.parent.viewType === 'ResourceView' ? (data.ganttProperties.width - 10) : '') + 'px; height:' +
                         this.taskBarHeight + 'px;">' + labelString + '</span>';
                 }
             }
@@ -603,7 +603,7 @@ var ChartRows = /** @class */ (function (_super) {
      */
     ChartRows.prototype.getTaskBaselineNode = function () {
         var data = this.templateData;
-        var template = '<div class="' + cls.baselineBar + ' ' + '" style="margin-top:' + this.baselineTop +
+        var template = '<div class="' + cls.baselineBar + ' ' + '" role="BaselineBar" style="margin-top:' + this.baselineTop +
             'px;left:' + data.ganttProperties.baselineLeft + 'px;' +
             'width:' + data.ganttProperties.baselineWidth + 'px;height:' +
             this.baselineHeight + 'px;' + (this.baselineColor ? 'background-color: ' + this.baselineColor + ';' : '') + '"></div>';
@@ -617,9 +617,10 @@ var ChartRows = /** @class */ (function (_super) {
      */
     ChartRows.prototype.getMilestoneBaselineNode = function () {
         var data = this.templateData;
+        var baselineMilestoneHeight = this.parent.renderBaseline ? 5 : 2;
         var template = '<div class="' + cls.baselineMilestoneContainer + ' ' + '" style="' +
             'left:' + (data.ganttProperties.baselineLeft - this.milesStoneRadius) + 'px;' +
-            'margin-top:' + (-Math.floor(this.parent.rowHeight - this.milestoneMarginTop) + 2) +
+            'margin-top:' + (-Math.floor(this.parent.rowHeight - this.milestoneMarginTop) + baselineMilestoneHeight) +
             'px">' + '<div class="' + cls.baselineMilestoneDiv + '">' + '<div class="' + cls.baselineMilestoneDiv +
             ' ' + cls.baselineMilestoneTop + '"  ' +
             'style="top:' + (-this.milestoneHeight) + 'px;border-right:' + this.milesStoneRadius +
@@ -647,7 +648,9 @@ var ChartRows = /** @class */ (function (_super) {
      */
     ChartRows.prototype.getLeftLabelNode = function (i) {
         var leftLabelNode = this.leftLabelContainer();
-        leftLabelNode[0].setAttribute('aria-label', this.generateTaskLabelAriaLabel('left'));
+        if (this.generateTaskLabelAriaLabel('left') !== "") {
+            leftLabelNode[0].setAttribute('aria-label', this.generateTaskLabelAriaLabel('left'));
+        }
         var leftLabelTemplateNode = null;
         if (this.leftTaskLabelTemplateFunction) {
             leftLabelTemplateNode = this.leftTaskLabelTemplateFunction(extend({ index: i }, this.templateData), this.parent, 'LeftLabelTemplate', this.getTemplateID('LeftLabelTemplate'), false, undefined, leftLabelNode[0], this.parent.treeGrid['root']);
@@ -669,9 +672,10 @@ var ChartRows = /** @class */ (function (_super) {
         return leftLabelNode;
     };
     ChartRows.prototype.getLableText = function (labelString, labelDiv) {
+        var leftLabelHeight = this.parent.renderBaseline ? ((this.parent.rowHeight - this.taskBarHeight) / 2) : this.taskBarMarginTop;
         var templateString = createElement('div', {
             className: labelDiv, styles: 'height:' + (this.taskBarHeight) + 'px;' +
-                'margin-top:' + this.taskBarMarginTop + 'px;'
+                'margin-top:' + leftLabelHeight + 'px;'
         });
         var spanElem = createElement('span', { className: cls.label });
         var property = this.parent.disableHtmlEncode ? 'textContent' : 'innerHTML';
@@ -690,7 +694,9 @@ var ChartRows = /** @class */ (function (_super) {
      */
     ChartRows.prototype.getRightLabelNode = function (i) {
         var rightLabelNode = this.rightLabelContainer();
-        rightLabelNode[0].setAttribute('aria-label', this.generateTaskLabelAriaLabel('right'));
+        if (this.generateTaskLabelAriaLabel('right') !== "") {
+            rightLabelNode[0].setAttribute('aria-label', this.generateTaskLabelAriaLabel('right'));
+        }
         var rightLabelTemplateNode = null;
         if (this.rightTaskLabelTemplateFunction) {
             rightLabelTemplateNode = this.rightTaskLabelTemplateFunction(extend({ index: i }, this.templateData), this.parent, 'RightLabelTemplate', this.getTemplateID('RightLabelTemplate'), false, undefined, rightLabelNode[0], this.parent.treeGrid['root']);
@@ -803,8 +809,10 @@ var ChartRows = /** @class */ (function (_super) {
                 else {
                     labelDiv = this.createDivElement('<span class="' +
                         cls.taskLabel + '" style="line-height:' +
-                        (this.taskBarHeight - 1) + 'px; display:' + (this.parent.viewType === 'ResourceView' ? 'inline-flex;' : ';') + 'width:' +
-                        (this.parent.viewType === 'ResourceView' ? (data.ganttProperties.width - 10) : ';') + 'px; height:' +
+                        (this.taskBarHeight - 1) + 'px;' + (this.parent.viewType === 'ResourceView' ? 'display:inline-flex;' : '') +
+                        (this.parent.viewType === 'ResourceView' ? 'width:' + (data.ganttProperties.width - 10) : '') + 'px; height:' +
+                        (this.taskBarHeight - 1) + 'px;' + (this.parent.viewType === 'ResourceView' ? 'display: inline-flex;' : '') +
+                        (this.parent.viewType === 'ResourceView' ? 'width:' + (data.ganttProperties.width - 10) : '') + 'px; height:' +
                         this.taskBarHeight + 'px;">' + labelString + '</span>');
                 }
                 progressBarInnerDiv[0].appendChild([].slice.call(labelDiv)[0]);
@@ -833,10 +841,10 @@ var ChartRows = /** @class */ (function (_super) {
         var className = (this.parent.gridLines === 'Horizontal' || this.parent.gridLines === 'Both') ?
             'e-chart-row-border' : '';
         table.innerHTML = '<tr class="' + this.getRowClassName(this.templateData) + ' ' + cls.chartRow + '"' +
-            'style="display:' + this.getExpandDisplayProp(this.templateData) + ';height:' +
+            'role="ChartRow" style="display:' + this.getExpandDisplayProp(this.templateData) + ';height:' +
             this.parent.rowHeight + 'px;">' +
             '<td class="' + cls.chartRowCell + ' ' + className
-            + '" style="width:' + this.parent.timelineModule.totalTimelineWidth + 'px;"></td></tr>';
+            + '" role="ChartCell" style="width:' + this.parent.timelineModule.totalTimelineWidth + 'px;"></td></tr>';
         return table.childNodes;
     };
     /**
@@ -901,7 +909,7 @@ var ChartRows = /** @class */ (function (_super) {
     };
     ChartRows.prototype.leftLabelContainer = function () {
         var template = '<div class="' + ((this.leftTaskLabelTemplateFunction) ? cls.leftLabelTempContainer :
-            cls.leftLabelContainer) + ' ' + '" tabindex="-1" style="height:' +
+            cls.leftLabelContainer) + ' ' + '" tabindex="-1" role="LeftLabel" style="height:' +
             (this.parent.rowHeight - 2) + 'px;width:' + this.taskNameWidth(this.templateData) + '"></div>';
         return this.createDivElement(template);
     };
@@ -913,7 +921,7 @@ var ChartRows = /** @class */ (function (_super) {
         var template = '<div class="' + cls.taskBarMainContainer + ' ' +
             this.parent.getUnscheduledTaskClass(data.ganttProperties) + ' ' +
             ((data.ganttProperties.cssClass) ? data.ganttProperties.cssClass : '') + '" ' +
-            ' tabindex="-1" style="' + ((data.ganttProperties.isMilestone && !manualParent) ?
+            ' tabindex="-1" role="TaskBar" style="' + ((data.ganttProperties.isMilestone && !manualParent) ?
             ('width:' + this.milestoneHeight + 'px;height:' +
                 this.milestoneHeight + 'px;margin-top:' + this.milestoneMarginTop + 'px;left:' + (data.ganttProperties.left -
                 (this.milestoneHeight / 2)) + 'px;') : ('width:' + data.ganttProperties.width +
@@ -924,26 +932,26 @@ var ChartRows = /** @class */ (function (_super) {
     };
     ChartRows.prototype.rightLabelContainer = function () {
         var template = '<div class="' + ((this.rightTaskLabelTemplateFunction) ? cls.rightLabelTempContainer :
-            cls.rightLabelContainer) + '" ' + ' tabindex="-1" style="left:' + this.getRightLabelLeft(this.templateData) + 'px;height:'
+            cls.rightLabelContainer) + '" ' + ' tabindex="-1" role="RightLabel" style="left:' + this.getRightLabelLeft(this.templateData) + 'px; height:'
             + (this.parent.rowHeight - 2) + 'px;"></div>';
         return this.createDivElement(template);
     };
     ChartRows.prototype.childTaskbarLeftResizer = function () {
         var lResizerLeft = -(this.parent.isAdaptive ? 12 : 2);
         var template = '<div class="' + cls.taskBarLeftResizer + ' ' + cls.icon + '"' +
-            ' style="left:' + lResizerLeft + 'px;height:' + (this.taskBarHeight) + 'px;"></div>';
+            ' role="LeftResizer" style="left:' + lResizerLeft + 'px;height:' + (this.taskBarHeight) + 'px;"></div>';
         return this.createDivElement(template);
     };
     ChartRows.prototype.childTaskbarRightResizer = function () {
         var rResizerLeft = this.parent.isAdaptive ? -2 : -10;
         var template = '<div class="' + cls.taskBarRightResizer + ' ' + cls.icon + '"' +
-            ' style="left:' + (this.templateData.ganttProperties.width + rResizerLeft) + 'px;' +
+            ' role="RightResizer" style="left:' + (this.templateData.ganttProperties.width + rResizerLeft) + 'px;' +
             'height:' + (this.taskBarHeight) + 'px;"></div>';
         return this.createDivElement(template);
     };
     ChartRows.prototype.childTaskbarProgressResizer = function () {
         var template = '<div class="' + cls.childProgressResizer + '"' +
-            ' style="left:' + (this.templateData.ganttProperties.progressWidth - 6) + 'px;margin-top:' +
+            ' role="ProgressResizer" style="left:' + (this.templateData.ganttProperties.progressWidth - 6) + 'px;margin-top:' +
             (this.taskBarHeight - 4) + 'px;"><div class="' + cls.progressBarHandler + '"' +
             '><div class="' + cls.progressHandlerElement + '"></div>' +
             '<div class="' + cls.progressBarHandlerAfter + '"></div></div>';
@@ -1141,10 +1149,13 @@ var ChartRows = /** @class */ (function (_super) {
      * @private
      */
     ChartRows.prototype.initChartHelperPrivateVariable = function () {
+        var taskbarHeightValue = this.parent.renderBaseline ? 0.45 : 0.62;
+        var taskBarMarginTopValue = this.parent.renderBaseline ? 4 : 2;
+        var milestoneHeightValue = this.parent.renderBaseline ? 1.13 : 0.82;
         this.baselineColor = !isNullOrUndefined(this.parent.baselineColor) &&
             this.parent.baselineColor !== '' ? this.parent.baselineColor : null;
         this.taskBarHeight = isNullOrUndefined(this.parent.taskbarHeight) || this.parent.taskbarHeight >= this.parent.rowHeight ?
-            Math.floor(this.parent.rowHeight * 0.62) : this.parent.taskbarHeight; // 0.62 -- Standard Ratio.
+            Math.floor(this.parent.rowHeight * taskbarHeightValue) : this.parent.taskbarHeight; // 0.62 -- Standard Ratio.
         if (this.parent.renderBaseline) {
             var height = void 0;
             if ((this.taskBarHeight + this.baselineHeight) <= this.parent.rowHeight) {
@@ -1155,11 +1166,11 @@ var ChartRows = /** @class */ (function (_super) {
             }
             this.taskBarHeight = height;
         }
-        this.milestoneHeight = Math.floor(this.taskBarHeight * 0.82); // 0.82 -- Standard Ratio.
-        this.taskBarMarginTop = Math.floor((this.parent.rowHeight - this.taskBarHeight) / 2);
+        this.milestoneHeight = Math.floor(this.taskBarHeight * milestoneHeightValue); // 0.82 -- Standard Ratio.
+        this.taskBarMarginTop = Math.floor((this.parent.rowHeight - this.taskBarHeight) / taskBarMarginTopValue);
         this.milestoneMarginTop = Math.floor((this.parent.rowHeight - this.milestoneHeight) / 2);
         this.milesStoneRadius = Math.floor((this.milestoneHeight) / 2);
-        this.baselineTop = -(Math.floor((this.parent.rowHeight - (this.taskBarHeight + this.taskBarMarginTop))) - 1);
+        this.baselineTop = -(Math.floor((this.parent.rowHeight - (this.taskBarHeight + this.taskBarMarginTop))) - 4);
         this.connectorPointWidth = this.parent.isAdaptive ? Math.round(this.taskBarHeight / 2) : 8;
         this.connectorPointMargin = Math.floor((this.taskBarHeight / 2) - (this.connectorPointWidth / 2));
     };
@@ -1353,6 +1364,7 @@ var ChartRows = /** @class */ (function (_super) {
             var indicators = this.templateData.ganttProperties.indicators;
             for (var indicatorIndex = 0; indicatorIndex < indicators.length; indicatorIndex++) {
                 taskIndicatorNode = this.getIndicatorNode(indicators[indicatorIndex]);
+                taskIndicatorNode[0].setAttribute('aria-label', indicators[indicatorIndex].name);
                 if (indicators[indicatorIndex].name.indexOf('$') > -1 || indicators[indicatorIndex].name.indexOf('#') > -1) {
                     taskIndicatorTextFunction = this.templateCompiler(indicators[indicatorIndex].name);
                     taskIndicatorTextNode = taskIndicatorTextFunction(extend({ index: i }, this.templateData), this.parent, 'indicatorLabelText');