jetsum_dhtmlx_gantt
Version:
An open source JavaScript Gantt chart that helps you illustrate a project schedule in a nice-looking chart.
399 lines (361 loc) • 9.67 kB
HTML
<html>
<head>
<link rel="stylesheet" type="text/css" href="../common/docs.css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale = 1.0" />
<title>Gantt : Samples</title></title>
</head>
<body>
<div class='abstop_header'>
<div class='content_area'>
</div>
</div>
<div class="page_header">
<div class='page_inner_header'>
<a href='https://dhtmlx.com'><div class='top_webix_logo'></div></a>
Samples
</div>
</div>
<div class="page_space">
<div class="webixdoc_page webixdoc_start">
<div id="webixContent" class='webixdoc_content'>
<div class="webixdoc_content_inner">
<div class="webixdoc_breadcrumb nav_breadcrumb">
<a href="https://docs.dhtmlx.com/gantt/" class="webixdoc_back">Documentation</a>
<a href="../" class="webixdoc_back">Samples</a>
<a href="../" class="webixdoc_back">Extensions</a>
</div>
<table class='nav_table'>
<tr>
<td style='width:30px;'>
<a href='01_quickinfo.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='01_quickinfo.html'>QuickInfo extension</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='02_tooltip.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='02_tooltip.html'>Tooltip</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='03_critical_path.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='03_critical_path.html'>Critical path</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='04_grid_resize.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='04_grid_resize.html'>Resizable columns in grid</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='05_today_line.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='05_today_line.html'>Today and Status lines in Gantt</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='06_dynamic_loading.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='06_dynamic_loading.html'>Loading subtasks on demand</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='07_managing_grid_columns.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='07_managing_grid_columns.html'>Hiding grid columns</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='08_tasks_grouping.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='08_tasks_grouping.html'>Tasks grouping</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='09_multiselection.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='09_multiselection.html'>Multiselection and Indent/Outdent tasks</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='10_tasks_grouping_multilevel.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='10_tasks_grouping_multilevel.html'>Multi level task grouping</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='11_full_screen.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='11_full_screen.html'>Full Screen</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='12_auto_scheduling.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='12_auto_scheduling.html'>Auto Scheduling extension</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='13_smart_rendering.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='13_smart_rendering.html'>Working with 30000 tasks</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='14_undo.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='14_undo.html'>Undo/Redo changes in Gantt</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='16_keyboard_navigation.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='16_keyboard_navigation.html'>Keyboard Navigation</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='17_keyboard_navigation_cell.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='17_keyboard_navigation_cell.html'>Keyboard Navigation - navigate cells</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='18_linked_tasks.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='18_linked_tasks.html'>Auto Scheduling - Groups of connected tasks</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='19_constraints_scheduling.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='19_constraints_scheduling.html'>Schedule From Project Start & Constraints</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='20_backwards_scheduling.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='20_backwards_scheduling.html'>Schedule From Project End</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='21_overlay.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='21_overlay.html'>Gantt chart with overlay</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='22_tooltip_api.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='22_tooltip_api.html'>Custom Tooltips</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='23_click_drag_splittask.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='23_click_drag_splittask.html'>Create split tasks by Drag and Drop</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='24_click_drag.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='24_click_drag.html'>Create new tasks by Drag and Drop</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='25_click_drag_select_by_drag.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='25_click_drag_select_by_drag.html'>Select multiple tasks by Drag and Drop</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='26_full_screen_with_additional_elements.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='26_full_screen_with_additional_elements.html'>Full Screen with additional elements</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='27_drag_timeline.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='27_drag_timeline.html'>Drag timeline</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='28_row_resize.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='28_row_resize.html'>Resizable rows in grid</a>
</td>
</tr>
<tr>
<td style='width:30px;'>
<a href='28_tasks_grouping_relation_properties.html'>
<div class='nav_page_img'> </div>
</a>
</td>
<td>
<a href='28_tasks_grouping_relation_properties.html'>Task grouping, different relation property types</a>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!--Side quick links -->
<div class="side_links">
<a class="reference_link" href="https://docs.dhtmlx.com/gantt/api__refs__gantt.html">
<span>API Reference</span>
</a>
<a class="sample_link" href="../">
<span>Code Samples</span>
</a>
<a class="forum_link" href="https://forum.dhtmlx.com/c/gantt">
<span>Developer Forum </span>
</a>
</div>
</div>
</div>
<div class="footer_linea"> </div>
<div class="footer_lineb">
<div class='page_inner_header'>
<a href='https://dhtmlx.com'><div class='bottom_webix_block bottom_webix_logo' ></div></a>
<div class='copyright bottom_webix_block'>© 2022 XB Software Ltd.<br>
All rights reserved</div>
<div class='bottom_webix_also'>
<h4>Check also:</h4>
<li><a href='https://dhtmlx.com/docs/products/dhtmlxScheduler/' target='_blank'>DHTMLX Scheduler</a></li>
<li><a href='https://dhtmlx.com/docs/products/dhtmlxSpreadsheet/' target='_blank'>DHTMLX Spreadsheet</a></li>
<li><a href='https://dhtmlx.com/docs/products/dhtmlxSuite/' target='_blank'>Other DHTMLX components</a></li>
</div>
</div>
</div>
<script>
var msBrowser =
navigator.userAgent.indexOf("MSIE ") > 0 ||
navigator.userAgent.indexOf("Trident") > 0 ||
navigator.userAgent.indexOf("Edge") > 0
if (msBrowser){
var summaryElements = document.querySelectorAll(".list_samples");
for (var i = 0; i < summaryElements.length; i++) {
var navItem = summaryElements[i];
var link = navItem.querySelector("a");
var parent = navItem.parentNode;
parent.insertBefore(link, navItem);
navItem.style.display = 'none';
}
}
</script>
</body>
</html>