Localization allows you to present the interface of the Gantt chart in the language you'd like: English, Spanish, French, etc. By default, dhtmlxGantt uses English locale.
To implement the Gantt chart in non-English language, you need to activate the necessary locale via the setLocale method of the gantt.i18n object.
gantt.i18n.setLocale("fr");
You can use and update any of the predefined locales that are bundled with the dhtmlxgantt.js file or define a custom locale.
The locale can be switched dynamically but the changes will be applied only after a complete redrawing of the Gantt chart either with the gantt.render() or gantt.init() call.
gantt.i18n.setLocale("fr");
gantt.init("gantt_here");
Language | Language code | Translation status |
Arabic | ar | partial |
Belarusian | be | full |
English | en | full |
Catalan | ca | partial |
Chinese | cn | partial |
Croatian | hr | full |
Czech | cs | partial |
Danish | da | partial |
Dutch | nl | partial |
Finnish | fi | partial |
French | fr | full |
German | de | full |
Greek | el | partial |
Hebrew | he | partial |
Hungarian | hu | partial |
Indonesian | id | partial |
Italian | it | partial |
Japanese | jp | partial |
Korean | kr | partial |
Norwegian | no | partial |
Norwegian Bokmål | nb | partial |
Persian | fa | full |
Polish | pl | partial |
Portuguese | pt | partial |
Romanian | ro | partial |
Russian | ru | full |
Slovak | sk | partial |
Slovenian | si | partial |
Spanish | es | partial |
Swedish | sv | partial |
Turkish | tr | partial |
Ukrainian | ua | partial |
The gantt.i18n object is added in v7.0. In previous versions, the gantt.locale object was used. For more information, see the Migration article.
The easiest way to create a custom locale is to make a copy of the default (English) locale from the sample below, and translate all strings from it into the required language.
The custom locale can be applied to the Gantt chart in two ways:
gantt.i18n.setLocale(localeObject);
Note, if you provide a partial locale object, gantt will add your labels into the current locale:
gantt.i18n.setLocale({
labels: {
new_task: "New task"
}
});
gantt.i18n.addLocale("lang", localeObject);
gantt.i18n.setLocale("lang");
Note,
English locale definition
gantt.i18n.setLocale({
date: {
month_full: ["January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December"],
month_short: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul",
"Aug", "Sep", "Oct", "Nov", "Dec"],
day_full: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday",
"Friday", "Saturday"],
day_short: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]
},
labels: {
new_task: "New task",
icon_save: "Save",
icon_cancel: "Cancel",
icon_details: "Details",
icon_edit: "Edit",
icon_delete: "Delete",
gantt_save_btn: "New Label",
gantt_cancel_btn: "New Label",
gantt_delete_btn: "New Label",
confirm_closing: "",// Your changes will be lost, are you sure?
confirm_deleting: "Task will be deleted permanently, are you sure?",
section_description: "Description",
section_time: "Time period",
section_type: "Type",
/* grid columns */
column_wbs: "WBS",
column_text: "Task name",
column_start_date: "Start time",
column_duration: "Duration",
column_add: "",
/* link confirmation */
link: "Link",
confirm_link_deleting: "will be deleted",
link_start: " (start)",
link_end: " (end)",
type_task: "Task",
type_project: "Project",
type_milestone: "Milestone",
minutes: "Minutes",
hours: "Hours",
days: "Days",
weeks: "Week",
months: "Months",
years: "Years",
/* message popup */
message_ok: "OK",
message_cancel: "Cancel",
/* constraints */
section_constraint: "Constraint",
constraint_type: "Constraint type",
constraint_date: "Constraint date",
asap: "As Soon As Possible",
alap: "As Late As Possible",
snet: "Start No Earlier Than",
snlt: "Start No Later Than",
fnet: "Finish No Earlier Than",
fnlt: "Finish No Later Than",
mso: "Must Start On",
mfo: "Must Finish On",
/* resource control */
resources_filter_placeholder: "type to filter",
resources_filter_label: "hide empty"
}
});