{"id":4631,"date":"2018-02-27T14:00:44","date_gmt":"2018-02-27T10:00:44","guid":{"rendered":"https:\/\/dhtmlx.com\/blog\/?p=4631"},"modified":"2026-01-30T11:50:12","modified_gmt":"2026-01-30T08:50:12","slug":"dhtmlxgantt-5-1-resource-management-rtl-mode-and-more","status":"publish","type":"post","link":"https:\/\/dhtmlx.com\/blog\/dhtmlxgantt-5-1-resource-management-rtl-mode-and-more\/","title":{"rendered":"dhtmlxGantt 5.1: Resource Management, RTL Mode and More"},"content":{"rendered":"<p>We are proud to introduce our new release of <a href=\"https:\/\/dhtmlx.com\/docs\/products\/dhtmlxGantt\/\" target=\"_blank\">dhtmlxGantt<\/a>: the version 5.1. It brings you such long-awaited features as resource planning and ability to use right-to-left mode. Continue reading to learn everything about the update.<\/p>\n<p><a href=\"https:\/\/dhtmlx.com\/docs\/products\/dhtmlxGantt\/download.shtml\" target=\"_blank\"><strong>Download dhtmlxGantt 5.1, JavaScript Gantt chart library<\/strong><\/a><\/p>\n<h5>Resource management<\/h5>\n<p>The possibility of resource management is quite critical for many projects because it helps to estimate not only a total load of a project, but its parts and load of each resource separately. When we talk about resources, we mean people, equipment, money, etc. In project management and gantt chart software in particular, the resources are mostly considered to be human resources, that&#8217;s why we&#8217;ve prepared some suitable examples for this case.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources-view.png\" alt=\"gantt resources view\" width=\"900\" height=\"600\" class=\"aligncenter size-full wp-image-4657\" srcset=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources-view.png 900w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources-view-300x200.png 300w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources-view-768x512.png 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/p>\n<p><a href=\"https:\/\/docs.dhtmlx.com\/gantt\/samples\/11_resources\/05_resource_usage_templates.html\" target=\"_blank\" class=\"page-link\">View the sample<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-planning-gantt.png\" alt=\"resource planning gantt\" width=\"900\" height=\"467\" class=\"aligncenter size-full wp-image-4646\" srcset=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-planning-gantt.png 900w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-planning-gantt-300x156.png 300w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-planning-gantt-768x399.png 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/p>\n<p>So, the resource management in dhtmlxGantt allows you to assign resources and apply particular styles to the tasks according to the resources assigned. What is more, human resources can have their own working schedules, so when you re-assign some task to another person, the duration of the task and the whole project will be adjusted to another working schedule. <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/samples\/11_resources\/02_resource_calendars.html\" target=\"_blank\" class=\"page-link\">View the sample<\/a><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources.png\" alt=\"gantt resources\" width=\"900\" height=\"378\" class=\"aligncenter size-full wp-image-4647\" srcset=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources.png 900w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources-300x126.png 300w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/gantt-resources-768x323.png 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/p>\n<p>As the gantt chart resource diagrams clearly demonstrate the total load of people and projects, it&#8217;ll be simple for the end users of you app to balance the resources load and manage the projects more efficiently. Using resources diagram in dhtmlxGantt, you can show such information as completeness, workload, capacity for each resource.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-diagram1-1.png\" alt=\"resource diagram\" width=\"900\" height=\"344\" class=\"aligncenter size-full wp-image-4659\" srcset=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-diagram1-1.png 900w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-diagram1-1-300x115.png 300w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/resource-diagram1-1-768x294.png 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/p>\n<p><em>Note that the resources management in dhtmlxGantt is available in Professional Edition only.<\/em><\/p>\n<p>For now, you can assign one resource per one task. We&#8217;re planning to add the ability to split the task between multiple resources in future updates, so stay tuned. <\/p>\n<h5>RTL mode<\/h5>\n<p>Starting from the version 5.1, dhtmlxGantt can be displayed in the right-to-left mode. All the elements of the gantt chart including a time scale, grid columns, tasks and dates can now start from the right part of the page and continue to the left.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/right-to-left-gantt-1.png\" alt=\"right to left gantt\" width=\"900\" height=\"338\" class=\"aligncenter size-full wp-image-4651\" srcset=\"https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/right-to-left-gantt-1.png 900w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/right-to-left-gantt-1-300x113.png 300w, https:\/\/dhtmlx.com\/blog\/wp-content\/uploads\/2018\/02\/right-to-left-gantt-1-768x288.png 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/p>\n<p><a href=\"https:\/\/docs.dhtmlx.com\/gantt\/samples\/10_layout\/04_rtl.html\" target=\"_blank\" class=\"page-link\">View the sample<\/a><\/p>\n<h5>Public destructors for Gantt chart and dataProcessor instances<\/h5>\n<p>The previous versions of dhtmlxGantt didn&#8217;t have a destructor method since usually the Gantt instance lives the whole lifetime of the page where it&#8217;s displayed.<\/p>\n<p>It&#8217;s not a problem by itself, but when we&#8217;re using dhtmlxGantt together with modern frameworks like Angular or React, we have to remember about it since the gantt instance couldn&#8217;t be destroyed together with its parent component.<\/p>\n<p>Thus, this is a small feature that will allow you to use dhtmlxGantt together with modular frameworks in a more intuitive way. <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/desktop__multiple_gantts.html#destructorofganttanddataprocessorinstances\" target=\"_blank\">Find out more in our documentation.<\/a><\/p>\n<h5>Various improvements to the layout configuration introduced in 5.0<\/h5>\n<p>In dhtmlxGantt 5.1, we&#8217;ve added many new options and removed some redundancy in the layout config, so your configuration code will be simpler and more powerful at the same time. <\/p>\n<p>One of most noticeable update is the ability to have an inner horizontal scroll in a lefthand grid. It allows you to place as many columns as you need.<\/p>\n<p><a href=\"https:\/\/docs.dhtmlx.com\/gantt\/samples\/07_grid\/10_scrollable_grid.html\" target=\"_blank\" class=\"page-link\">View the sample<\/a><\/p>\n<h5>Ability to drag-n-drop projects together with their subtasks<\/h5>\n<p>The last new thing for today: you can now move projects together with their subtasks in the timeline. The option is disabled by default, <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/desktop__dnd.html#draggingprojectswithsubtasks\" target=\"_blank\">you can enable it in the config<\/a>. <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/samples\/08_api\/19_draggable_projects.html\" target=\"_blank\" class=\"page-link\">View the sample<\/a><\/p>\n<h5>NPM installation for dhtmlxGantt Professional Edition<\/h5>\n<p>You often ask about the ability to install the PRO edition via npm. While we still don&#8217;t provide a private npm feeds for PRO versions of the component, the package now includes package.json file which allows installing it as a npm module locally. Read some useful information about all possible ways of <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/desktop__install_with_bower.html#addingprofessionaleditionintoproject\" target=\"_blank\">npm installing of dhtmlxGantt PRO<\/a>.<\/p>\n<h5>Related resources:<\/h5>\n<ul>\n<li><a href=\"https:\/\/dhtmlx.com\/docs\/products\/dhtmlxGantt\/download.shtml\">Try new dhtmlxGantt 5.1<\/a><\/li>\n<li>Login to the <a href=\"https:\/\/dhtmlx.com\/clients\/\" target=\"_blank\">Clients Area<\/a> to get the latest PRO edition<\/li>\n<li>Check <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/whatsnew.html\" target=\"_blank\">full what&#8217;s new list<\/a> in the docs<\/li>\n<li>Browse <a href=\"https:\/\/docs.dhtmlx.com\/gantt\/samples\/11_resources\/\" target=\"_blank\">new samples of using the resources<\/a><\/li>\n<li>Check <a href=\"https:\/\/trello.com\/b\/fhOySHPj\/gantt-roadmap\" target=\"_blank\">dhtmlxGantt roadmap<\/a> for future updates<\/li>\n<\/ul>\n<p>We hope you enjoy the update! Let us know about your opinion in the comments section below.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>We are proud to introduce our new release of dhtmlxGantt: the version 5.1. It brings you such long-awaited features as resource planning and ability to use right-to-left mode. Continue &#8230;<\/p>\n","protected":false},"author":2,"featured_media":4654,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17,70,1,38],"tags":[33,20,4],"class_list":["post-4631","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-posts-for-codeproject-com","category-releases","category-uncategorized","category-visible","tag-all-posts","tag-gantt","tag-dhtmlx-updates"],"_links":{"self":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts\/4631","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/comments?post=4631"}],"version-history":[{"count":2,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts\/4631\/revisions"}],"predecessor-version":[{"id":13871,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/posts\/4631\/revisions\/13871"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/media\/4654"}],"wp:attachment":[{"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/media?parent=4631"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/categories?post=4631"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dhtmlx.com\/blog\/wp-json\/wp\/v2\/tags?post=4631"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}