Hi,
In Dojo chose Kendo UI 2020 R1 SP2 library and created a Gantt chart with two summaries and a task. Each summary has a child task.
Set rowHeight to 40px.
Expand Summary1. Summary2 changed position and moved to the top of the row.
Collapse Summary1. Summary2 still at the top of the row.
Also, tried with other libraries, the result is the same.
Noticed that if rowHeight is not set, summary doesn't change its position.
Example here: https://dojo.telerik.com/IriJegeX
Please find the screenshot attached.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet</title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.default-v2.min.css"/>
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2020.1.406/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.406/styles/kendo.mobile.all.min.css">
<script src="https://kendo.cdn.telerik.com/2020.1.406/js/angular.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2020.1.406/js/jszip.min.js"></script>
</head>
<body>
<div id="gantt"></div>
<script>
$("#gantt").kendoGantt({
rowHeight: "40px",
dataSource: [{
id: 1,
orderId: 0,
summary: true,
parentId: null,
title: "Summary1",
start: new Date("2014/6/17 9:00"),
end: new Date("2014/6/17 11:00")
},
{
id: 2,
orderId: 0,
parentId: 1,
title: "Task1",
start: new Date("2014/6/17 9:00"),
end: new Date("2014/6/17 11:00")
},
{
id: 3,
orderId: 1,
summary: true,
parentId: null,
title: "Summary2",
start: new Date("2014/6/17 9:00"),
end: new Date("2014/6/17 11:00")
},
{
id: 4,
orderId: 0,
parentId: 3,
title: "Task2",
start: new Date("2014/6/17 9:00"),
end: new Date("2014/6/17 11:00")
},
{
id: 5,
orderId: 2,
parentId: null,
title: "Task3",
start: new Date("2014/6/17 9:00"),
end: new Date("2014/6/17 11:00")
}]
});
</script>
</body>
</html>
Thanks.
